HTML5 Drag and Drop: Sorting Photos Into Albums Today, I would like to tell you about Drag and Drop and HTML5. As you know (I hope), all modern browsers (should be FF, Safari, Chrome, possibly Opera) have native support of this useful feature (drag and drop). It means that we can use drag and drop in our projects, and the code won’t be very difficult. And, as an example of practical implementation, let's assume that we have to sort some media (images) to distribute into some albums. I think that this is the one of the common, trivial tasks in web development of different CMSs or photo websites. Today I have prepared a nice example of how to achieve it. As first, I suggest you download the source files and keep the demo opened in a tab for better understanding. Live Demo download result So, let's start! Step 1. index.html You can see here three droppable objects (our virtual albums) and twelve images. Step 2. Now, it's time to style our example. css/main.css Step 3. js/main.js As you can see – the code is not very difficult. Conclusion
RoyalSlider for WordPress - Touch-Based Image and Content Slider brand-new version of the most popular plugin on CodeCanyon 10+ templates, 5+ skins, 100+ options RoyalSlider plugin for WordPress uses same script as HTML version and supports everything that HTML version does. View all frontend featuresTemplates and skins are sets of options and CSS styles that can be applied in a one single click. View RoyalSlider demos RoyalSlider is perfect for everyone Photographers Bulk image uploading, option to connect to 500px, Flickr or Instagram.SEO friendly images, lazy-loading. Designers Edit slide markup directly in admin, WYSIWIG animated blocks editor, add your own skins. Developers Unminified version of script, access to build tool from HTML version, powerful API. short admin panel overview, video does not contain any sound Dynamic sources Posts of any type Populate data (image, content ...) from any post type and filter it by taxonomies (categories, tags...). Flickr, 500px, Instagram Default Post Gallery Override default WordPressin-post [gallery]. Images HTML text