background preloader

Slider

Facebook Twitter

10 Impressive Techniques to Spice up your WordPress Theme. WordPress awesomeness lies in its fact that it can be customized to power any type of site you like!

10 Impressive Techniques to Spice up your WordPress Theme

But what happens when you combine the power of javascript with WordPress, the possibilities are infinite. This article will share 10 great practices, examples & Plugins for using the most popular Javascript frameworks out there to spice up your WordPress theme. 1. Frontpage Slideshow. Run away, run far far away This module is tied to a commercial product, is unsupported, is poorly implemented, lacks modern features, and is poorly documented.

Frontpage Slideshow

First, it requires a third party, commercial Javascript library ($28). Second, it's not maintained at all. As of today it hasn't been updated in nearly a year and a half and has 39 open bug and support issues that have never been addressed. Third, it's implementation in Drupal is not as strong as it could be.

Fourth, it has no support for Imagecache. Finally, I can find no online documentation and only a partially written README.txt file which keeps referring to FCKeditor. There are many better alternatives out there. Review by MatteusX [info] on August 11, 2010 - 14:53. jQuery.ScrollTo. jQuery.ScrollTo by Ariel Flesler Links Table of contents (try these) Ways to specify the target Click an option, to see it in action Options The examples shown here, are summarized for brevity, check the source for real code Note that when 'queue' is true, choosing 'axis' as 'xy' or 'yx' matters Don't use a hash for the target to scroll only one axis, use the option 'axis' instead.

jQuery.ScrollTo

Dynamic Drive- Dynamic Content. Dynamic Content Sub Categories Featured Content Slider FF1+ IE5+ Opr7+ Featured Content Slider makes a slideshow out of arbitrary content on your page, so users can manually select a content to see or have them rotated automatically.

Dynamic Drive- Dynamic Content

Each content is defined simply inline on the page as regular HTML, or altogether inside a single external file and fetched via Ajax instead. A fade effect accompanies the transition from one slide to the next. Featured Content Glider FF1+ IE6+ Opr9+ Similar in purpose to the above, This script turns ordinary pieces of HTML content on your page into an interactive, "glide in" slideshow. Animated Collapsible DIV v2.2 FF1+ IE6+ Opr9+ This script collapses any DIV on the page and lets users manually toggle its appearance via a smooth "Web 2.0 style" animation.

DD Drop Down Panel FF1+ IE6+ Opr9+ DD Drop Down Panel lets you tuck away ordinary HTML content on the page and revealed on demand when the user clicks on the protruding tab. jQuery for Designers - Tutorials and screen. How to Solve the Problem Recreating this effect is simple to do if you know what plugins to use.

jQuery for Designers - Tutorials and screen

There are plugins out in the wild already, but we want our jQuery to satisfy the following requirements: Degrades perfectly without JavaScript enabledSliding panels effect without hogging browser CPUNext and previous buttons added using JavaScript because they hold no use without JavaScriptHitting the page with a specific hash (i.e. page.html#preview) shows the right tab, and highlights the right navigationAny link on the page that refers back to a panel should trigger the effect and highlight the right navigation – this should happen without any extra work The hash is the emphasised part (including the # symbol) in: In fact, our version of this slider will be better than Panic’s and the current jQuery plugins if we can meet all of the requirements.

For example, in the Panic example linking directly to the preview pane doesn’t correctly highlight the navigation. Plugins Required Markup. jQuery plugin - Easy Image or Content Slider. Click here for the new version of this plugin This is my first jQuery plugin.

jQuery plugin - Easy Image or Content Slider

I wrote several jQuery scripts but never made a real plugin just because I was I afraid of it’s complexity. Easy Slider 1.5 - The Easiest jQuery Plugin For Sliding Images a. Click here for the new version of this plugin Version 1.5 of my Easy Slider plugin for jQuery is here.

Easy Slider 1.5 - The Easiest jQuery Plugin For Sliding Images a

This is one of the my rare scripts that make it to their second version. All of the features here are result of your comments, so if you have more ideas, keep ‘em coming! Note: in case you haven’t already, you might want to check out article about first version of this plugin. Creating a Slick Auto-Playing Featured Content Slider. I love the Coda Slider plugin for jQuery.

Creating a Slick Auto-Playing Featured Content Slider

I've used it recently to build a couple of tabbed "widgets". One here on CSS-Tricks in the sidebar to show Script & Style links, Featured Posts, and Popular Posts. Just kind of a fun way to show lots of content in a small area. I also used it on an article for NETTUTS for a similar purpose. Both of these examples use the Coda Slider pretty much "out of the box". View Demo Download Files Functionality Checklist Like I said, the Coda Slider was 90% there already. Here is what we need in addition: Different types of custom content in the panels. Let's go through the HTML, CSS, and JavaScript.