Javascript

  • 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 
  • Powerange and Switchery: HTML5 Switches and Sliders in Flat Design

    Alexander Petkov creates ripples having developed two free HTML5 components following the popular flat design trend. The latest one, Powerange, allows you to create modern range sliders clearly inspired by iOS7 and the older Switchery does the same job for switches. Both components are designed as combinations of CSS and JavaScript without further dependencies and run in all modern browsers, even Internet Explorer (from 8+ in Switchery and 9+ in Powerange). You need not be a fan of iOS7 to enjoy the features of Petkov’s components as customization allows you to take the looks to wherever you want them to..



    Read more 
  • Pump up da Project: 5 Must-Have JavaScripts (March 2014 Edition)

    Great to see you liked the first iteration of "5 Must-Have JavaScripts". This is a foundation to build upon, so I decided to give you a fresh shot of must-have JavaScripts on a monthly basis. Today I dug up another 5 most recommendable specimen…



    Read more 
  • Pump up da Project: 5 Must-Have JavaScripts (February 2014 Edition)

    Have you already heard of “You might not need jQuery”? That site created ripples soon after its release a few weeks ago. It suggests that you might be better off targeting modern browser features directly, instead of relying on jQuery to achieve basically the same. Then again, who as a developer can actually determine which browsers will definitely not be used for visiting the project about to be created. I have my doubts doubting jQuery overall, yet I have always had sympathies for JavaScripts that are self-contained and not dependent on jQuery. I would not recommend going for pure CSS at the moment, even if theoretically possible. JavaScript is needed anyway, so why not use it where suitable. Following I put together a fresh bunch of those that impressed me most lately…



    Read more 
  • Responsive Images: Still Waiting for a Standard? Try Rwd.Images.Js Instead!

    Responsive Images is a topic far from resolved. Will it be the picture element as proposed by the W3C or will it be the srcset attribute as proposed by WHATWG in the end? No matter what time will bring, responsive images are a problem that needs to be solved today and not sometime in the future. No wonder that JavaScript is the remedy of choice. There are quite a few scripts targeting responsive imaging, quality varies though. A brand-new script by Matt Stow from Australia shows the potential to become the best available client-side interim solution…



    Read more 
search form
 
image description image description