Visual-Blast Media

Free web resources for designers and web developers | Tutorials, Scripts, Graphics, Photoshop, CSS

‘Javascript’ Articles

jqGalScroll - a smooth image scrolling

jQuery Gallery Scroller (jqGalScroll) takes list of images and creates a smooth scrolling photo gallery scrolling vertically, horizontally, or diagonally. The plugin will also create pagination to allow you to flow through your photos.

jquery_gallery_scroller.jpg

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

MooFilm - Mootools-Based Tooltip Fader for Images

MooFilm - Tooltip Fader for Images.

  • The script opens a info-pane overlay while the cursor is moved over a image.
  • Adjustable SlideIn/SlideOut effects.
  • Link identification.
  • The appearance can be customized via CSS styesheet.
  • onShow, beforeShow and onHide events.

Tested browsers: Firefox 2, Safari 3, Internet Explorer 6/7, Opera 9 under Windows.

moofilm.jpg

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

Smart Lists - convert HTML lists into categorized, paginated lists

Smart Lists is a Prototype/Scriptaculous extension that converts flat HTML lists of information into categorized, paginated lists.

Smart Lists extension does not require a database or server-side script and downgrades gracefully if JS is not enabled.

smart_lists.jpg

You have a choice for the item hide/show effect (Blind, Fade/Appear, Grow/Shrink, none), choice for changing page effect (Blind, Fade/Appear, Grow/Shrink, none), Control over speed at which effects occur, number of items per page and much more.

Browser friendly and supports Firefox 2, IE6+, Safari 2+ and Opera 9+.

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

MoreCSS - JavaScript library

MoreCSS is a small JavaScript library for everyday things, like creating popups, tab menus, tables and lists with “zebra”-style … etc. But the really special thing is: you can do these things like in regular CSS.

morecss_js_library.jpg

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

Password Strength Checker

The Password Meter help users choosing a more secure password when filling in registration forms. You are free to integrate it into your web application. Software is freely available for distribution under the GNU General Public License (GPL).

This application is designed to assess the strength of password strings. The instantaneous visual feedback provides the user a means to improve the strength of their passwords, with a hard focus on breaking the typical bad habits of faulty password formulation.

password_meter.jpg

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

GlassBox Javascript Library

GlassBox is a Javascript library which use Prototype and Script.aculo.us for some effects. With GlassBox you can build impressive transparent borders, colorful layouts and “Flash-like” effects.

GlassBox is licensed under the terms of the MIT License. This means: you can use it, free of charge, for anything you like.

glassbox_javascript_library.jpg

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

Lightview 2 - overlay anything, not just images

Lightview is a Prototype/Scriptaculous image viewer with adjustable rounded corners, smart image resizing, build in slideshow and works on all modern browsers.

Nick Stakenburg has released Lightview v2. With Lightview v2.0 you can also overlay video (Quicktime), Ajax, Flash .swf, iframe and inline content.

Download and include Prototype 1.6.0.2 and Scriptaculous 1.8.1 in your header. If the filesize is to big for you, with Protopacked you can have the required files, Prototype and effects.js, starting at 28kb.

lightbox_viewer_2.jpg

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

mooSlideBox 3 - Ajax based slider

mooSlideBox 3 - a slider for mootools with support for additional html tags and images that slide from the bottom of the screen upwards. Small and slim ajax based extension or replacement of the common “lightbox”. Works in IE 6/7, Opera and Firefox.

You can define an image, text, heading and additional content to be displayed.

Note: As many users complain that the slider isn’t unobstrusive, there’s a simple solution. Change the effect in the mooslide.js.  Replace the Fx.Transitions.Bounce.easeOut with something like Fx.Transitions.linear.

mootools_slide_box_3.jpg

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

jQZoom - jquery plugin

jQZoom - allows you to realize a small magnifier window close to the image or images on your web page easily.

jqzoom.jpg

DEMO -  jQZoom demo page

Easy to implement:

  • include the jqzoom.css in your page
  • include jQzoom and jQuery code
  • assign the “jqzoom” class to the image or images you would like to zoom
  • Load the plugin at window load
  • specify options

Download jQZoom v1.2

Full instructions at Mind-Projects jQZoom project page

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

FancyZoom - Smooth Javascript Image Zooming

FancyZoom - Smooth Javascript image zooming. Designed to view full-size photos and images inline without requiring a separate web page load.

fancy_zoom_images.jpg

  • Automatically scales images from any image link, with no HTML changes
  • Preloads full-size images in the background on link mouseover
  • No resource-heavy Javascript libraries — 100% coded from scratch to zoom
  • Draws a nice drop shadow under the full-size image to offset it from the page
  • Uses Safari 3’s “box-shadow” feature to draw the drop shadow natively, no images required
  • Requires only two new lines of code in your HTML
  • Tested and works with Safari, Firefox, IE7, and IE6. (Looks better in modern browsers.)

Free for non commercial use.

Digg it   Add to Del.icio.us  Stumble it   |  Subscribe to RSS

Page 4 of 6« First...«23456»

Translations

English flagItalian flagPortuguese flagGerman flagFrench flagSpanish flagRussian flag