|
Expando Image is a simple script for folks who want to have an image expand onMouseover (to its actual size). Its make your tumbnail image, and have dynamically when the mouse roll over image. Its a simple instally to your blog. Give your "tumbnail image" with a CSS class "Expando".Your "tumbnail image" shoul have explicit width and height atribute that less than actual size.
See example in My banner friends.
This step to make Expando image :
1. Download JavaScript of Expando Here or Mirror Here
2. Save Expando.js to your file hosting, example : geocities.com, googlepages, etc.
3. After Upload please enter to your blog > layout > Edit HTML do not forget to check Expand Widget Templates
4. Copy the following code :
<style type="text/css">
img.expando{ /*sample CSS for expando images. Not required but recommended*/
border: none;
vertical-align: top; /*top aligns image, so mouse has less of a change of moving out of image while image is expanding*/
}
</style>
<script type="text/javascript" src="http://www.yourhosting.com/your id/expando.js">
/* Expando Image Script ©2008 John Davenport Scheuer
as first seen in http://www.dynamicdrive.com/forums/
username: jscheuer1 - This Notice Must Remain for Legal Use
*/
</script>
5. Change the text color red with an address file that has been in the media your Upload file storage comrade.
6. Enter the code Under
<head>
7. Save your template.To change the Image you must follow this step :
Chose this code to your image widget.
1. Link Banner image Code, for example like this :<a href="http://yourblog1.blogspot.com" target="_blank"><img class="expando" border="0" alt="test" src="http://blablabla.com/run.jpg" width="80" height="20"></a>
2. Your Image code, Example :
<img class="expando" border="0" src="amster2.jpg" width="100" height="75">
http://yourblog1.blogspot.com << Change with your website
http://blablabla.com/run.jpg << Change with your image link
class="expando" << dont forget to always insert this to your code
width="100" height="75"> << Change with your "tumbnail image" size.
You can modified code with your creation but don forget to always insert class="expando"
Article Info : www.dynamicdrive.com
The Epson Movie - Mate projector features versatile connectivity, including HDMI support, which
ReplyDeletehave made it easy to enjoy, while having more entertainment options.
Monitors by this company are probably what I would
look into getting. On the other hand, I was having
some really bad handshaking problems that seemed worse when playing SACD, DVD-Audio and BD Audio discs at 1080p output (or on "auto") and
Source Direct helped here.
Here is my site :: MOTU Digital Performer v8.02 free download