InnerFade with jquery What is it? InnerFade is a small plugin for the jQuery-JavaScript-Library. It's designed to fade you any element inside a container in and out. These elements could be anything you want, e.g. images, list-items, divs. Simply produce your own slideshow for your portfolio or advertisings. The call Examples A newsticker (with animationtype: 'slide') <ul id="news"><li><a href="#n1">1 Lorem ipsum dolor</a></li><li><a href="#n2">2 Sit amet, consectetuer</a></li><li><a href="#n3">3 Sdipiscing elit,</a></li><li><a href="#n4">4 sed diam nonummy nibh euismod tincidunt ut</a></li><li><a href="#n5">5 Nec Lorem. A list with images and links Elements with classes Download jquery.innerfade.zip (124kb) Webdesign Leipzig – Medienfreunde GbR
A New Wordpress Slideshow Plugin Creates Beautiful Slideshows in With a great looking and easy to manage WordPress slideshow plugin you can show off photos, illustrations, products etc. in a way that visitors gonna love. Website slideshows are made up of content, commonly nice images with some captions, that e.g. slide in from the side. Slideshow WordPress plugins typically offer a set of administration pages making it simple to upload and organize the image files to be part of the online slideshow. On the page that visitors see there are various solutions to how slideshows look and work so, it is a good idea to check as many live demos as possible. Check out the list below and see if you can find a cool WordPress slidershow plugin for your website. Advertisement Disclosure: Please note that some of the links below are affiliate links and I will earn a commission if you purchase through those links (at no extra cost to you). Slideshow Gallery - MORE INFO Lightspot Slider – MORE INFO / DEMO This is a cool WordPress banner and slideshow plugin.
Fancybox - Fancy lightbox alternative Getting Slim, Spicy, & WordPress-Ready with Top 10 jQuery Pl What’s great about jQuery is how easily you can create impressive animations and interactions with a super lightweight size. WordPress awesomeness lies in its fact that it can be customized to power any type of site you like! Now, when we harness the power of WordPress with some sexy jquery magical effects, the possibilities are infinite. Recently, a number jQuery plugins has been popping around facing huge admiration from users around the worlds. In this article, we’ll explore 10 Most Wanted jQuery Plugins Now Ready For WordPress. Don’t Forget to… subscribe to our RSS-Feed for future updates. 1. jQuery Image Slider Nivo Slider is a lightweight (7kb compressed) jQuery plugin for creating good-looking image sliders with 9 unique transition effects. WordPress Version: WP Nivo Slider This plugin creates a Slideshow/Slider with post thumbnails in your posts configured for a particular category of your wordpress. 2. A flipping page gallery jFlip builds an image gallery made as a book. 5. 6. 7. 8.
ColorBox - customizable lightbox plugin for jQuery 1.3 & 1.4 A lightweight customizable lightbox plugin for jQuery View Demos Released under the MIT License, source on Github (changelog) Download Install via NPM npm install jquery-colorbox Compatible with: jQuery 1.3.2+ in Firefox, Safari, Chrome, Opera, Internet Explorer 7+ Supports photos, grouping, slideshow, ajax, inline, and iframed content.Lightweight: 10KB of JavaScript (less than 5KBs gzipped).Appearance is controlled through CSS so it can be restyled.Can be extended with callbacks & event-hooks without altering the source files.Completely unobtrusive, options are set in the JS and require no changes to existing HTML.Preloads upcoming images in a photo group.Currently in use on a million-plus websites. Instructions & Help The FAQ has instructions on asking for help, solutions to common problems, and how-to examples. Usage Colorbox accepts settings from an object of key/value pairs, and can be assigned to any HTML element. Settings Public Methods Event Hooks Hey,
jFancyTile: A jQuery tile shifting image viewer plugin Previous week, colleague Willem and I were checking out the mosaic slideshow created by Martin. We were both impressed by his example, but wanted to take it to another level. We discussed on how we could add some features and how it should look like. Willem tranformed this idea to Silverlight and I created an easy to use jQuery plugin that does the same. This jQuery plugin called jFancyTile is a tile shifting image viewer. Check out the demo to see the plugin live. Take note this plugin is pretty CPU intense and works best when a low rowCount and columnCount is used on relatively small images. Video Demonstration Here's a video example on how the plugin works on Google Chrome. How to use Make sure your HTML looks like the following: The alt attribute from each image will be used to display as the title on top. Next, include the needed CSS and jQuery files to your HTML head: Now you're ready to use the plugin! $("#selector").jfancytile(); That's all there is to it! How it works Known issues
JQuery Cycle Plugin Check out Cycle2, the latest in the Cycle line of slideshows. The jQuery Cycle Plugin is a slideshow plugin that supports many different types of transition effects. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and much more. Images are used in these demos because they look cool, but slideshows are not limited to images. Use the Effects Browser page to preview the available effects. For more about options, see the Options Reference page. Frequently Asked Questions Special thanks to Torsten Baldes, Matt Oakes, and Ben Sterling for the many ideas that got me started on writing Cycle in 2007.
Making a Content Slider with jQuery UI - Nettuts+ In this tutorial we’re going to be using the jQuery UI slider widget to create an attractive and functional content slider. We’ll have a container, which has a series of elements each containing different blocks of content. There will be too many of these elements to display at once, so we can use the slider to move the different content blocks in and out of view. jQuery UI is the official library of widgets and utilities built on top of jQuery; it’s very easy to use, highly configurable and robust, and extremely easy to theme. Getting Started Let’s make a start on the basic page and underlying HTML first; in your text editor create the following page: Save this as slider.html in the slider folder. We haven’t added any styling yet but for reference, the following screenshot shows the default slider widget: The Underlying Mark-up On the page all we have is the mark-up for the content and the slider; we’ve got an outer container element which we’ve given the class name ui-corner-all.