Javascript

  • Sequence.js: Responsive Content Slider with CSS3 Transitions and Gesture Control

    Plugins for content sliders are a dime a dozen, fish in the sea, you name it. Fewer, but still many are supporting CSS3 transitions and working responsively. Anyway „Sequence.js“ is something special. This JavaScript does not only support animations on the transition of slides as a whole. Instead all of the content of a slide, be it headlines or images, can be animated individually. Being a top-notch web tool, „Sequence.js“ even supports gesture control to be intuitively usable on smartphones and tablets as well. Now tell me, doesn’t this set that responsive content slider far enough apart to justify a closer look?



    Read more 
  • SVG Fallback in Older Browsers: Alternatives to JavaScript

    SVG sees widespread support by recent browsers these days. Still plenty of people do not surf the web using one of these modern browsers. Especially the older versions of Internet Explorer are used in relevant numbers worldwide. And these older versions cause problems, not only, but also when it comes to SVG. IE simply doesn’t know SVG, so we need to offer PNG or JPEG as a fallback. Of course we have JavaScript with its numerous possibilities to care for proper fallback solutions, but what if JavaScript is not an option? Keep calm and read on. We have a row of alternatives for you. Some of which mean even lesser effort than coming forth with a full-fledged JavaScript…



    Read more 
  • HTML5 Canvas: Drawing Made Simpler with Fabric.js

    Drawing with the HTML element Canvas doesn’t leave much to be desired. Complex shapes and animations are possible, the feature set is quite impressive. Yet we need to combine several methods when it comes to e.g. create a shape, rotate it and fill it with a color. The JavaScript library Fabric.js simplifies the possibilities Canvas has to offer and adds functionality to het work done faster. Animations and interactions are created and applied in next to no time.



    Read more 
  • HTML5: Native Dialogue Windows With the New Dialog Element

    New HTML5 elements and new JavaScript APIs allow us to create complex applications for the browser. Part of any modern application are one or more dialogue windows. These require users to confirm the execution of certain actions or simply issue a message. With the new „<dialog>“ element we can now markup these windows using pure HTML5.



    Read more 
  • Better than Pure CSS3: Realistic and Complex Shadows with Shine.js

    Thanks to CSS3 there are several possibilities to apply shadows to elements. We have text as well as element shadows, and even a shadow filter exists. Unfortunately all CSS3 shadows are limited to simple drop shadows, where you can define its colour, its blur, the offset and the size. The new JavaScript library offers many more features to let you create much more realistic and complex shadows with Shine.js.



    Read more 
  • MagicSuggest for jQuery: Beautiful Selection Comboboxes Based on Bootstrap 3

    The „<select>“ element makes it easy to markup input areas for multiple selections. On the downside there are quite a few limitations to it and it sure doesn’t look anywhere near as great as MagicSuggest does. Instead of having boring select lists, MagicSuggest allows us to create beautiful comboboxes capable of multiple selections from both freely entered and prepopulated items.



    Read more 
  • HTML5 Imports: Import HTML Files Into HTML Files

    The „link“ element is a blessing. It allows for easy embedding of stylesheets and JavaScripts needed in multiple documents. It didn’t allow the embedding of HTML files, though. To achieve that we were limited to the „iframes“ element or the JavaScript method „XMLHttpRequest()“. Thanks to the new HTML5 Imports, we can now use the „<link>“ element to load one HTML file into another.



    Read more 
  • Coming to a Screen Near You: CSS3 Animations and The New JavaScript Method Animate()

    With CSS3 animations in HTML documents have become fairly easy to achieve. Using the "@keyframes" rule various properties such as position and size of an HTML element get defined. Then the property "animation" cares for getting the keyframes up and running according to their definitions. Without the need for JavaScript and plug-ins we are able to create even complex animations, that run most flawlessly in all modern browsers. Problems occur as soon as you need to get JavaScript to enter the game of creating CSS3 animations. We all know, JavaScript is more often than not unavoidable as we need to calculate individual values or an animation process as a whole.



    Read more 
  • WebComponents.org: All About The Future of The Web

    Web Components were the craze for a while. As with all standardization projects, as time passes, the effect wears off. In 2012 standardization of the web components specs felt near. Today it’s still a work in progress. There are a growing number of promising approaches and technical solutions, though. Instead of forcing you to roam the depths and widths of the web to collect vital information on web components, the community itself, supported by staff from Google and Mozilla, decided to create a central platform, covering all aspects of the future technology. Now that effort is online. It answers to the name WebComponents.org.



    Read more 
  • Adobe’s Snap.svg: Animations With HTML 5, Without Flash

    Flash has long been the standard for vector-based web animations. Some say for too long. The rise of mobile clients led to an acceleration of web standards such as HTML5. Thanks to the SVG formats, which is widely supported by modern browsers, we are able to embed vector-based graphics into our web projects without the need for a plug-in. Adobe’s JavaScript library Snap.svg even allows for the creation of vector-based animations with SVG.



    Read more 
search form
 
image description image description