Back to vBulletin 3.6 Template Modifications

Icons with rollover effect below navbar
Mod Version: 1.00, by Sofia

This modification is in the archives.
vB Version: 3.6.x Rating: (1 vote - 5.00 average) Installs: 3
Released: 29 May 2009 Last Update: Never Downloads: 1
Not Supported Re-usable Code Translations  

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.




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!

Download

No files for download.

Similar Mods

Mini Mods Icons with rollover effect below navbar vBulletin 3.8 Template Modifications

vblts.ru supports vBulletin®, 2022-2024