mattboldt / typed.js

A JavaScript Typing Animation Library
http://www.mattboldt.com/demos/typed-js/
MIT License
15.59k stars 1.76k forks source link

Without jQuery #203

Closed jimmywarting closed 7 years ago

jimmywarting commented 8 years ago

I didn't want to include jQuery just for this plugin, so I created my own version of this. It's quite scaled down, Typed.js had to many options IMO - only did what was necessary for me

Right now it only works in chrome, opera & FF 52 But with babel it will work like a charm...

For anyone interested here is a demo

Orbyt commented 8 years ago

I just visited this repository looking to see if it was usable with React. Using jQuery with React is a no-go, which renders this project unusable for those using React.

Perhaps an official port without jQuery for use with React would be a useful addition here, as the current options for typing animations usable with React are not as popular as Typed.js.

jimmywarting commented 8 years ago

I tried React before... Never liked it. They change the html syntax to camelCase, even changed some attributes names that didn't even make since to me. Like using className instead of just class. And coding html in jsx was something else... I like the binding part but not so much of anything else

When you have worked with web and Node for such a long time and you know that all frameworks comes and go but one thing will always stay. Html, css & javascript So today i mostly only do vanilla coding

But if you want a react port of this then it's fine by me. But you have to do it without my contribution

It's easy to build a plugin that is made from vanilla code and hook it up to jQuery, Angular, React, Aurelia, etc - but never so if the plugin depends on some library

jimmywarting commented 8 years ago

Now when i think of it i would maybe even have extracted out the html part out of my version so it can be used for inputs, objects Data-binding and other DOM elements (would also be easier to do unit testing)

vanilla code:

elm = document.querySelector('.element')
typed({
    strings: ['Hangout', 'Facebook', 'Web App', 'your email', 'Messenger', 'anything!!!']
    set value(val) {
      elm.innerText = val
    }
})

Angular:

typed($scope.opts = {
    strings: ['Hangout', 'Facebook', 'Web App', 'your email', 'Messenger', 'anything!!!']
})
<div>{{opts.value}}</div>
luisvinicius167 commented 7 years ago

I created a library for me, with no jQuery dependency, if someone can take a look: https://ityped.surge.sh Thanks!

tripndots commented 7 years ago

@luisvinicius167

Very sexy, and it works in my React Project!

luisvinicius167 commented 7 years ago

@sequentialbro Yeah, nice! ;)

mattboldt commented 7 years ago

A jQuery-free typed.js has been released under v1.1.6 thanks to this guy: @nikrolls