Posted on : 09-09-2010 | By : Shadman Jamil | In : Ajax, Ajax slide, Featured, Gallery, Scripts, Slider, jquery, news
Posted on : 26-06-2010 | By : Shadman Jamil | In : Ajax, Ajax slide, Featured, Gallery, Slider, jquery, jquery plugin, news
Until this day, jQuery is still blowing me away with its simplicity and robustness. As you can see, I have been concentrated to produce tutorials about it, and I just couldn’t help it! Right, this time, we’re going to learn how to create a news slider that come with the following features:
- Slideshow with Image and description/caption
- previous, next, pause and play buttons
- On mouse over, pause the slideshow, and play it on mouse out
- Sliding effect for both gallery panel and excerpt panel
- Adjustable slideshow speed
- And, finally, smarter script that will calculate width and height for the slideshow
We’re going to use scrollTo jQuery plugin during the development. A huge thumb up and big thank you to Ariel Flesler who created the plugin.
qGallery is a simple to use prototype based gallery script.
All image processing is done by the script so yo2u don’t have to worry about the images you upload on the server. All images for the skimmer graphics and the fullsize view will be created on the fly and stored in a cache directory on the server to save processing power on the server.
The script is fully customizable. You can change the size of the gallery, the interface graphics, the colors and some of the features. It’s possible to switch the skimmer overlay bar off, change or turn off the reflections, make the skimmer graphics smaller, decide what style you want for the scrollbar (windows or mac style) and a lot of other settings…
Posted on : 11-04-2010 | By : Shadman Jamil | In : Ajax, Ajax slide, Animation, Featured, Gallery, Menue, Slider, news
Posted on : 11-04-2010 | By : Shadman Jamil | In : Ajax, Lightbox, jquery, jquery plugin, news
GreyBox can be used to display websites, images and other content in a beautiful way.
Why use GreyBox:
- It does not conflict with pop-up blockers
- It’s only 22 KB!
- It’s super easy to setup
- It’s super easy to use
- You can easily alter the style as it is controlled through CSS
To trigger GreyBox you’ll only need to append a rel tag on your a tags:
<a href="http://google.com/" title="Google" rel="gb_page_fs">Launch google.com in fullscreen window</a>
It takes very little code to display image galleries:
<a href="greybox/night_valley.jpg" rel="gb_imageset[nice_pics]" title="Night valley"> <img src="greybox/night_valley_thumb.jpg" /> </a> <a href="greybox/salt.jpg" rel="gb_imageset[nice_pics]" title="Salt flats in Chile"> <img src="greybox/salt_thumb.gif" /> </a>
Append following to your header section. GB_ROOT_DIR is the URL where static files are located:
GB_ROOT_DIR should be absolute.
Append also following scripts and one stylesheet:
AJS_fx.js is optional. It’s used for effects.
You are ready to use GreyBox. Look on the documentation to see details and examples.
Where could it be used?
- Showing external pages
- AJAX uploading of files
- Showing internal pages (login, user preference, properties, contact formulas etc.)
- Showing a video or a flash animation
- Showing images
- Showing product information
- Admin sections
What browsers are supported?
- Firefox 1.5+
- Internet Explorer 5.5+
- Opera 8.5+
Other browsers may also be supported.
Need help? Join the GreyBox group
Please use our Google group if you need help:
You’ll need to become a member if you want to post.
Sites using GreyBox
Posted on : 11-04-2010 | By : Shadman Jamil | In : Ajax, Embed video, Player, Video player, jquery, jquery plugin, news
Option - (default)holderId – (ytvideo)
The ID of the element (usually a div) into which the YouTube video will be inserted
playerHeight – (300)
The height of the embdedded youtube video
playerWidth – (450)
The width of the embdedded youtube video
addThumbs - (false)
Use true to add video thumbnails to each list item
thumbSize – (small)
Size of added thumbnails. Default is small, use large for larger thumbnails
showInline – (false)
If this option is true, the list item containing the link will be replaced with the YouTube video. See the gallery demo for an example of this.
autoPlay – (false)
true or false, whether or not to autoplay videos
showRelated – (true)
Set to false to stop related videos being shown at the end of the embedded video