Page 1 of 1

Expando image bbcode

Posted: 11 Jun 2010, 17:40
by kber
Description: Expando is a simple script for folks who want to have an image expand onMouseover (to its actual size). This lets you display large images at a reduced size initially (aka thumbnail size), and have them dynamically expand when the mouse rolls over them
Live Demo
first : copy the attach file to your forum root
then :
open : yourstyle/template/viewtopic_body.html
find

Code: Select all

<!-- INCLUDE overall_header.html -->
add after

Code: Select all

<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="expando.js">

</script>
now create your bbcode :

BBcode usage

Code: Select all

[imgexpo]{URL}[/imgexpo]
HTML replacement

Code: Select all

<img class="expando" border="0" src="{URL}" width="100" height="75">
then check Display on posting page
and Go :mrgreen:
Source

Re: Expando image bbcode

Posted: 11 Jun 2010, 18:02
by cisco007
well i guess i stand corrected, i will delete my previous post!