Connexion
One Laptop per Child Logo
Google Search
Google

LabsSphère Catégories
Css (9)
Php (8)
Javascript (11)
Xoops (5)
Divers (1)
Design (10)

Blog : Dynamic Drive

Dhtml scripts for the real world URL Flux
Dernière mise à jour : 22/2/2011 8:03:00 Mettre à jour

2011-02-22T08:03:00+01:00 | 4 lectures

This jQuery script lets you easily embed a Google Map on your page that supports switching between multiple addresses. A two column layout is presented by default, with the list of desired addresses on the left column and a Google Map on the right.


2011-02-22T08:03:00+01:00 | 5 lectures

Sticky Note lets you displays floating content anywhere on the page that remains in view even when the page is scrolled. Each sticky note content can be defined either inline on the page, or inside an external text file and fetched via Ajax instead.


2010-12-16T22:50:00+01:00 | 3 lectures

Speech Bubbles Tooltip lets you add tooltips to links using either the value of the link's title attribute, or rich HTML defined all inside a single HTML file and fetched using Ajax instead. The style of the tooltip is modelled after the iconic speech bubble and uses NO images, thanks to the CSS triangle technique.


2010-11-01T21:46:00+01:00 | 19 lectures

This script uses CSS's "positon:fixed" property plus a splash of JavaScript to create a sticky footer or header bar that expands when the mouse rolls over it. It's useful for showing supplemental information of a site that should always be in within a mouse action away. The markup of the bar can either be inline HTML defined within the page it's on, or entirely in a separate HTML file and fetched via Ajax.


2010-10-01T19:55:00+02:00 | 15 lectures

This powerful jQuery script turns a FORM into a multi-step FORM wizard! Simply group logical elements within your FORM by surrounding them with the FIELDSET element, and the script does the rest in creating a new page for each group, plus the appropriate "Steps" text and pagination links above and below the form.


2010-08-19T04:57:00+02:00 | 5 lectures

Continuous Reel Slideshow lets you showcase images in a reel like fashion, one image at a time and in an continuous manner, with no breaks between the first and last slide.


2010-08-11T16:23:00+02:00 | 4 lectures

SAG Scroller takes a regular UL list and scrolls it upwards, one LI at a time and pausing in between. It lets you showcase content that can either be defined inline on the page, or in an external file and fetched via Ajax instead. The scroller can be set to either auto scroll, or on user demand via the navigation panel as part of its interface.


2010-06-29T05:40:00+02:00 | 2 lectures

Fluid Text Resizer is a compact yet versatile jQuery based text resizer script. It can adjust the text size of a particular section of your page or the entire document in general. A fluid animation is used to morph into the new text size, and session cookies are used to remember the new setting.


2010-05-10T21:37:00+02:00 | 4 lectures

This script lets you view a magnified portion of any image upon moving your mouse over it. A magnifying glass appears alongside the image displaying the magnified area on demand. The user can toggle the zoom level by using the mousewheel. It's great to use on product images, photos, or other images with lots of details you want users to be able to get into on command.


2010-04-05T01:12:00+02:00 | 9 lectures

Image Bubbles is a cool Flash-like effect that causes an image to bubble up and expand whenever the mouse rolls over it from within a series of images. It's a nice way to draw attention to an image when the mouse rolls over it. For images with an "alt" attribute defined, the script will use it to render a nice tooltip that's shown above the enlarged image. Both the speed and magnification level of the image when it bubbles up can be customized.


2010-03-01T23:53:00+01:00 | 7 lectures

Some images are worth a closer look, which is why there's Image Power Zoomer. It gives any image on your page the ability to be magnified when the mouse rolls over it. A "magnifying glass" that appears over the image lets the user zoom in on any portion of it as it follows the cursor around. Furthermore, the magnification power can be adjusted on the fly by turning the mouse wheel back or forth, just like in many graphics programs.


2010-01-26T05:32:00+01:00 | 5 lectures

Quite possibly the only ticker of its kind out there, Expandable Drop Down Ticker brings together the best of two worlds to create a ticker that can be viewed both sequentially and simultaneously. A drop down menu is automatically generated out of snippets of the ticker contents to let the user navigate the ticker on demand.


2009-12-27T22:05:00+01:00 | 87 lectures

Enhance arbitrary links on your page with some multi level powers with jQuery Popup Menu! It lets you associate a multi level drop down menu to any link on the page, so moving the mouse over the link activates the menu to be shown beside it.


2009-12-17T10:56:00+01:00 | 59 lectures

This jQuery script lets you associate a multi-level context menu to any element on the page, so right clicking within the element activates the menu. The default context menu of the browser is suppressed as a result. A different context menu can be added to different elements on the page, such as one for the document as a whole, another for just a DIV on the page etc.


2009-11-26T01:55:00+01:00 | 10 lectures

This script adds a rich HTML tooltip to elements that's revealed when the mouse rolls over them, in which the tooltip follows the cursor around as it moves about within the element. The tooltip can be "stickied", or kept visible on the screen by right clicking on pressing "s" should the user wish to interact with some content within the tooltip, such as click a link inside it.