vb.org Archive - Mini Mods - Icons with rollover effect below navbar

Icons with rollover effect below navbar

Description
This mod allows you to add an icons box below your navbar. Icons have an increase effect simply due to a rollover. No Javascript code. This mod works with all versions of Firefox, IE and Nescape.

http://www.picdo.net/Fichiers/beb7cb...z_rollover.png

In your template Navbar, add at the bottom:

Code:

<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" width="100%" align="center">

<tr>



<td class="alt1" align="center">



<a href="www.link.com/albums" onMouseOver="icon1.src='images/misc/icon1_big.png'"  onMouseOut="icon1.src='images/misc/icon1_small.png'"><img src="images/misc/icon1_small.png" border="0" name="icon1" alt="title" HSPACE=0 VSPACE=0></a>



<a href="www.link.com/logs" onMouseOver="icon2.src='images/misc/icon2_big.png'"  onMouseOut="icon2.src='images/misc/icon2_small.png'"><img src="images/misc/icon2_small.png" border="0" name="icon2" alt="title" HSPACE=0 VSPACE=0></a>



<a href="www.link.com/partner" onMouseOver="icon3.src='images/misc/icon3_big.png'"  onMouseOut="icon3.src='images/misc/icon3_small.png'"><img src="images/misc/icon3_small.png" border="0" name="icon3" alt="title" HSPACE=0 VSPACE=0></a>



</td></tr></table>

<br />

1. Upload

You must upload your icons into "images/misc".
For an icon, you must have 2 images : a small image for egs: 50x50px) and a big image (for egs: 100x100px). Big images appears on mouseover.

Icons name:
icon1_small.png
icon1_big.png
icon2_small.png
icon2_big.png
etc...

2. In the previous code, please modify:

Example: Icon 1

----------------------------------------------------------------------
<a href="www.link.com/albums" -- Enter your redirect link
----------------------------------------------------------------------

----------------------------------------------------------------------
alt="title" -- Enter your image title
----------------------------------------------------------------------

----------------------------------------------------------------------
icon1.src='images/misc/icon1_big.png
icon1.src='images/misc/icon1_small.png
<img src="images/misc/icon1_small.png"
name="icon1"
If you add more icons, you must rename this by icon4, icon5, icon6, etc...
----------------------------------------------------------------------

Enjoy! :)

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01120 seconds Memory Usage 1,719KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (1)bbcode_code_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)post_thanks_navbar_search (1)printthread (2)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: