vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 3.8 Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=236)
-   -   Mini Mods - Icons with rollover effect below navbar (https://vborg.vbsupport.ru/showthread.php?t=214826)

Sofia 05-28-2009 10:00 PM

Icons with rollover effect below navbar
 
1 Attachment(s)
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.


https://vborg.vbsupport.ru/vborg_mis...hreadid=214826

https://vborg.vbsupport.ru/external/2009/05/9.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! :)

CrazyProgrammer 05-29-2009 09:54 AM

Vey Nice sofia like it :)

Coroner 05-29-2009 01:30 PM

This seems similar to this (Fisheye Menue) ? Isn't it ?
https://vborg.vbsupport.ru/showthread.php?t=160422

Sofia 05-29-2009 01:37 PM

Quote:

Originally Posted by Coroner (Post 1819532)
This seems similar to this (Fisheye Menue) ? Isn't it ?
https://vborg.vbsupport.ru/showthread.php?t=160422

Hi Coroner.
No. It's just a template modification to include rollover. Fisheye Menue add a "zoom in and increase" effect on icon and use JS files (I think).

pein87 05-29-2009 02:19 PM

nice work your very creative sofia but as a rule of thumbs all mouse events are small caps xhtml doesnt allow the old onMouseOver events, good job keep up that creativity.

goxy63 05-29-2009 07:36 PM

Awesome
Installed, nominated, rated

I must say that I love you Sofia :)

In 'Vb' way of course

Cheers

TheLastSuperman 05-29-2009 07:46 PM

Quote:

Originally Posted by Sofia (Post 1819534)
Hi Coroner.
No. It's just a template modification to include rollover. Fisheye Menue add a "zoom in and increase" effect on icon and use JS files (I think).

2 others like it as well on here Coroner but this one is less and no files to upload, even if similar she had the time and creativity to add the right elements together and make it simple for everyone.

Good job, glad to see it's not just another similar mod yet it is, creativity imo :D.

S-MAN

Sofia 05-29-2009 07:51 PM

Quote:

Originally Posted by TheLastSuperman (Post 1819775)
2 others like it as well on here Coroner but this one is less and no files to upload, even if similar she had the time and creativity to add the right elements together and make it simple for everyone.

Good job, glad to see it's not just another similar mod yet it is, creativity imo :D.

S-MAN

Thank you, TheLastSuperman :)

goxy63 06-04-2009 10:47 PM

Just one small question

I would like that row does not stretch out when I hoover with mouse over small icon, that is I would like to keep row hight lets say 128px(same as big icon)
I dont like that rest of my forums jump every time....
Would be cool that small icons are centered by width and hight, and when hoover on them row does not stretch out

Any pointers for this

Thanks
_____________
Just got some free time and ....found how to fix my problem
Just after code for width added
height="128"
and also added conditionals for guests, I dont like that some icons are vissible for them...
before
<a href="http://....
added
<if condition="$show[member]">

marshal_ramdev 06-07-2009 05:15 AM

its just like Dock in Rock .. Mod..

https://vborg.vbsupport.ru/showthrea...ight=dock+rock


All times are GMT. The time now is 05:27 AM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01148 seconds
  • Memory Usage 1,749KB
  • 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
  • (3)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (1)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)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
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete