Orbit: jQuery Image Slider Plugin from ZURB - ZURB Playground - ZURB.com 1.3.0 (1/25/2012): Add custom events to allow control via custom JavaScript. Fixed intermittent loading issue on Chrome. Fixed IE issues. 1.2.3 (3/17/2011): Fixed a number of issues including: Fixed issue of false parameters failingCan now have just 1 slide without it failingReorganized kit download to isolate "demo" pieces and core codeIncluded jQuery 1.5.1We've edited some of the docs here around "Content" slides 1.2.1 (2/3/2011): Changed caption styles to not break on different sized sliders and added documentation in here about positioning other than relative. 1.2 (1/20/2011): Content compatible, new loading animation, thumbnail navigation for bullets, animated captions, no more overflow hidden on the container, restructured the markup & js, changed the base UI, added callback, mouseover pause, better timer interactions and re-browser tested. 1.1 (9/4/2010): Added bullet navigation, linkable images, full HTML captions, a loading animation and greater browser compatibility.
Getting Started Installation Later is available through both npm and bower for easy installation. The installation includes all of the files that you will need to use the library. Node.js is required for building, testing, and benchmarking the library. Using npm: $ npm install later Using bower: $ bower install later If you would prefer, you can also download the source along with compiled versions of the library in a single zip file. Download Example usage Later works in both the browser (IE7+, FireFox, Chrome, Safari) and Node.js environments. Node Example var later = require('later'); var sched = later.parse.text('every 5 mins'), occurrences = later.schedule(sched).next(10); for(var i = 0, i < 10; i++) { console.log(occurrences[i]); } Browser Example <script src="later.min.js" type="text/javascript"></script><script type="text/javascript"> var sched = later.parse.text('every 5 minutes'), occurrences = later.schedule(sched).next(10); for(var i = 0, i < 10; i++) { console.log(occurrences[i]); } </script> License
TekDefense - News SlidesJS, a responsive slideshow plug-in for jQuery (1.7.1+) with features like touch and CSS3 Blueberry - A simple, fluid, responsive jQuery image slider. What is Blueberry? Blueberry is an experimental opensource jQuery image slider plugin which has been written specifically to work with fluid/responsive web layouts. A brief history With the popularity of smart phones and tablet devices responsive/fluid web layouts have become an important part of modern web design. Working on a new project I decided to use the 1140px grid from cssgrid.net. So, I decided to start writing a basic plugin with the aim of making it suitable for responsive web design. The goal The hope is that I can at least nudge developers of more popular slider plugins to think about responsive web design, and make their plugins compatible. In the mean time, I aim to continue to develop this plugin (time permitting), squashing some of the bugs and implementing more advanced features. Check out the contribute section to find out how you can help. Frequently Asked Questions Why is it called Blueberry? Help make Blueberry better Known issues Wishlist Buy me a beer
Swipe is the most accurate touch slider PingInfoView - Ping to multiple host names/IP addresses See Also PC Inventory - Scan your network and create reports on all software & hardware parameters of all your devices. NetResView - View all computers/shares on your network. FastResolver - Host Names/IP Addresses/MAC Address Scanner Description PingInfoView is a small utility that allows you to easily ping multiple host names and IP addresses, and watch the result in one table. System Requirements This utility works under Windows 2000, Windows XP, Windows Server 2003, Windows Server 2008, Windows Vista, Windows 7, Windows 8, and Windows 10. Versions History Version 1.65 The 'Consecutive Failed Count' column now keeps the last value when pings are ok again. Using PingInfoView PingInfoView doesn't require any installation process or additional dll files. Known Issues By default, PingInfoView accumuates the result of all pings in memory for displaying the pings result in the lower pane. Use IP-Host Description format Command-Line Options Translating PingInfoView to other languages License Feedback
Slit Slider Revised Slit Slider is a slideshow with a twist: when navigating the slides, the current one will be "cut open" into two slices and moved away, revealing the next or previous slide. The slider can be used in a responsive context and it has been updated and improved. View demo Download source We have updated the , fixed some issues and made the slider responsive. . Demos We’ve improved the original demo and because of some requests we’ve added another one which shows how the slider can be used in full width, fixed height and background images. Summary of Changes A lot of changes were integrated into the new Slit Slider, here are the most important ones: The slider can now be used in a responsive context, simply set the wrapper’s width to a percentage and it will adapt. The Transit plugin was removed. We’ve added public methods for navigation control: next, previous and specific slide. Keyboard navigation has been added (right and left arrow keys). The Firefox bug has been fixed.
ResponsiveSlides.js · Responsive jQuery Slider & Slideshow Responsive Carousel Project: Now Open Source Posted by Scott on 08/09/2012 Topics: javascript jQuery mobile progressive enhancement In our responsive client work, we frequently find ourselves in need of a carousel component that is lightweight, fluid in layout, usable with different input modes (mouse, keyboard, touch), and extensible to the particulars of each implementation. The Responsive Carousel project is available on Github. How-to To use the responsive carousel, just reference the following required CSS and JS files, and add a class of carousel to any element in your page that contains a series of sibling elements: With the default build, slides switch immediately with "Prev" and "Next" buttons. Extensions & Demos If you’d like to create a build that includes certain extensions, your can add them to the JS files listed under concat in the /grunt.js file, and run grunt from a command line (you’ll need Grunt and Node.js installed on your machine for this to work). Additional information Issues, Ideas, and Contributions
Positioning Elements » Best Practices Web Design Looking for the lessons? Get started! Positioning elements for page layouts. The entire Web Design Principles section can be accessed through the menu below. Unfortunately, not everyone's browser will support the spiffy JavaScript menu behind that innocent-looking button. If your browser won't display the menu, just click on the button and you'll be taken to a separate page with the entire menu displayed in clear, non-JavaScript HTML. Position is nine-tenths of the law. — Maggie Tuck Positioning elements in an HTML page is usually done through the CSS stylesheet. The key to understanding positioning is understanding the box model of Web design layout. More about block and inline elements. If you haven't read the page above, you might go back and look it over before moving forward on this page. Bradley notes: When people are new to CSS layouts there’s a tendency to gravitate toward positioning. Maybe a bit obvious and even trite, but it's true, and therefore worth quoting. The Box Model Hmmmm.
How to Create a Simple Multi-Item Slider A tutorial on how to create a simple category slider with a minimal design using CSS animations and jQuery. The idea is to slide the items sequentially depending on the slide direction. View demo Download source For today’s tutorial we want to show you how to create a simple item slider with CSS animations and some jQuery. So, let’s get started with this last tutorial of 2012! The Markup For the HTML we will use a division that wraps some unordered lists that will contain the items and a navigation with the category links. Let’s take a look at the style. The CSS Note that the CSS will not contain any vendor prefixes, but you will find them in the files. Let’s first style the wrapper, which is the division with the class mi-slider. The ul will be positioned absolutely which means that all the lists will be on top of each other. The pointer events of the current list should be reset, so that the containing links are clickable: Whithout JS we don’t want them to translate: The JavaScript
Rhinoslider: The most flexible jQuery slider/slideshow