TJFweb
01-18-2009, 04:38 AM
Hi,
I'm developing a custom style and I'm trying to make a graphical navbar for my forums.
I've put my navbar in the header template, and so far it looks like this:
<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center" style="background-color: #FFFFFF">
<tr>
<td align="$stylevar[left]"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
<td align="$stylevar[right]" id="header_right_cell">
<if condition="$ad_location['ad_header_logo']">$ad_location[ad_header_logo]<else /></if>
</td>
</tr>
<tr>
<td align="$stylevar[left]" style="background-image: url('images/iwca/navbar_bg.gif'); height: 39px">
<!-- nav buttons bar -->
<div style="padding:$stylevar[cellspacing]px; border-top-width:0px">
<table cellpadding="0" cellspacing="0" border="0" align="left">
<tr align="center">
<if condition="$show['member']">
<td class="vbmenu_control" style="background:url(images/iwca/navbar/usercp.gif); width: 60px" onmouseover="this.style.background='url(images/iwca/navbar/usercp_blu.gif)'" onmouseout="this.style.background='url(images/iwca/navbar/usercp.gif)'"><a href="usercp.php$session[sessionurl_q]"><img src="images/clear.gif" width="60px" height="39px"></a></td>
</if>
<if condition="$show['registerbutton']">
<td class="vbmenu_control"><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></td>
</if>
$template_hook[navbar_buttons_left]
<td class="vbmenu_control" style="background:url(images/iwca/navbar/faq.gif); width: 34px" onmouseover="this.style.background='url(images/iwca/navbar/faq_blu.gif)'" onmouseout="this.style.background='url(images/iwca/navbar/faq.gif)'"><a rel="help" href="faq.php$session[sessionurl_q]" accesskey="5"><img src="images/clear.gif" width="34px" height="39px"></a></td>
<if condition="$show['communitylink'] AND $show['popups']">
<td class="vbmenu_control" style="background:url(images/iwca/navbar/community.gif); width: 34px" onmouseover="this.style.background='url(images/iwca/navbar/community_blu.gif)'" onmouseout="this.style.background='url(images/iwca/navbar/community.gif)'"><a id="community" href="$show[nojs_link]#community" rel="nofollow" accesskey="6"><img src="images/clear.gif" width="81px" height="39px"></a> <script type="text/javascript"> vbmenu_register("community", true); </script></td>
<else />
<if condition="$vboptions['enablememberlist']">
<td class="vbmenu_control"><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></td>
</if>
<if condition="$show['quick_links_groups']">
<td class="vbmenu_control"><a href="group.php?$session[sessionurl]">$vbphrase[social_groups]</a></td>
</if>
</if>
<td class="vbmenu_control"><a href="calendar.php$session[sessionurl_q]">$vbphrase[calendar]</a></td>
<if condition="$show['popups']">
<if condition="$show['searchbuttons']">
<if condition="$show['member']">
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>
<else />
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
</if>
<td class="vbmenu_control"><a id="navbar_search" href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[search]</a> <if condition="$show['quicksearch']"><script type="text/javascript"> vbmenu_register("navbar_search"); </script></if></td>
</if>
<if condition="$show['member']">
<td class="vbmenu_control"><a id="usercptools" href="$show[nojs_link]#usercptools" accesskey="3">$vbphrase[quick_links]</a> <script type="text/javascript"> vbmenu_register("usercptools"); </script></td>
</if>
<else />
<if condition="$show['searchbuttons']">
<td class="vbmenu_control"><a href="search.php$session[sessionurl_q]" accesskey="4">$vbphrase[search]</a></td>
<if condition="$show['member']">
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>
<else />
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
</if>
</if>
<td class="vbmenu_control"><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a></td>
<if condition="$show['member']">
<td class="vbmenu_control"><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&focus=1','buddylist','statusbar=no,me nubar=no,toolbar=no,scrollbars=yes,resizable=yes,w idth=250,height=300'); return false;">$vbphrase[open_contacts]</a></td>
</if>
</if>
$template_hook[navbar_buttons_right]
<if condition="$show['member']">
<td class="vbmenu_control"><a href="login.php?$session[sessionurl]do=logout&logouthash=$bbuserinfo[logouthash]" onclick="return log_out('$vbphrase[sure_you_want_to_log_out]')">$vbphrase[log_out]</a></td>
</if>
</tr>
</table>
</div>
<!-- / nav buttons bar -->
</td>
</tr>
</table>
<!-- /logo -->
<!-- content table -->
$spacer_open
$_phpinclude_output
$ad_location[ad_header_end]
Note: In the above code, I've only customised up to and including the 'Community' link.
As you can see, I'm trying to use onmouseover / onmouseout events to change the TD background. It works perfectly for all buttons except Community, Search and Quick Links, which all use drop down menus.
I think this may be due to the popup Javascript for these navbar entries interfering with my onmouseover / onmouseout code.
Can someone please tell me how I can get this to work? I've seen this done in a lot of custom styles (i.e. http://www.vbstyles.com/demo/index.php?styleid=28 )
Thanks!
--------------- Added 1232262163 at 1232262163 ---------------
Edit: Never mind, fixed with https://vborg.vbsupport.ru/showpost.php?p=1204408&postcount=5
I'm developing a custom style and I'm trying to make a graphical navbar for my forums.
I've put my navbar in the header template, and so far it looks like this:
<!-- logo -->
<a name="top"></a>
<table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center" style="background-color: #FFFFFF">
<tr>
<td align="$stylevar[left]"><a href="$vboptions[forumhome].php$session[sessionurl_q]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
<td align="$stylevar[right]" id="header_right_cell">
<if condition="$ad_location['ad_header_logo']">$ad_location[ad_header_logo]<else /></if>
</td>
</tr>
<tr>
<td align="$stylevar[left]" style="background-image: url('images/iwca/navbar_bg.gif'); height: 39px">
<!-- nav buttons bar -->
<div style="padding:$stylevar[cellspacing]px; border-top-width:0px">
<table cellpadding="0" cellspacing="0" border="0" align="left">
<tr align="center">
<if condition="$show['member']">
<td class="vbmenu_control" style="background:url(images/iwca/navbar/usercp.gif); width: 60px" onmouseover="this.style.background='url(images/iwca/navbar/usercp_blu.gif)'" onmouseout="this.style.background='url(images/iwca/navbar/usercp.gif)'"><a href="usercp.php$session[sessionurl_q]"><img src="images/clear.gif" width="60px" height="39px"></a></td>
</if>
<if condition="$show['registerbutton']">
<td class="vbmenu_control"><a href="register.php$session[sessionurl_q]" rel="nofollow">$vbphrase[register]</a></td>
</if>
$template_hook[navbar_buttons_left]
<td class="vbmenu_control" style="background:url(images/iwca/navbar/faq.gif); width: 34px" onmouseover="this.style.background='url(images/iwca/navbar/faq_blu.gif)'" onmouseout="this.style.background='url(images/iwca/navbar/faq.gif)'"><a rel="help" href="faq.php$session[sessionurl_q]" accesskey="5"><img src="images/clear.gif" width="34px" height="39px"></a></td>
<if condition="$show['communitylink'] AND $show['popups']">
<td class="vbmenu_control" style="background:url(images/iwca/navbar/community.gif); width: 34px" onmouseover="this.style.background='url(images/iwca/navbar/community_blu.gif)'" onmouseout="this.style.background='url(images/iwca/navbar/community.gif)'"><a id="community" href="$show[nojs_link]#community" rel="nofollow" accesskey="6"><img src="images/clear.gif" width="81px" height="39px"></a> <script type="text/javascript"> vbmenu_register("community", true); </script></td>
<else />
<if condition="$vboptions['enablememberlist']">
<td class="vbmenu_control"><a href="memberlist.php$session[sessionurl_q]">$vbphrase[members_list]</a></td>
</if>
<if condition="$show['quick_links_groups']">
<td class="vbmenu_control"><a href="group.php?$session[sessionurl]">$vbphrase[social_groups]</a></td>
</if>
</if>
<td class="vbmenu_control"><a href="calendar.php$session[sessionurl_q]">$vbphrase[calendar]</a></td>
<if condition="$show['popups']">
<if condition="$show['searchbuttons']">
<if condition="$show['member']">
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>
<else />
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
</if>
<td class="vbmenu_control"><a id="navbar_search" href="search.php$session[sessionurl_q]" accesskey="4" rel="nofollow">$vbphrase[search]</a> <if condition="$show['quicksearch']"><script type="text/javascript"> vbmenu_register("navbar_search"); </script></if></td>
</if>
<if condition="$show['member']">
<td class="vbmenu_control"><a id="usercptools" href="$show[nojs_link]#usercptools" accesskey="3">$vbphrase[quick_links]</a> <script type="text/javascript"> vbmenu_register("usercptools"); </script></td>
</if>
<else />
<if condition="$show['searchbuttons']">
<td class="vbmenu_control"><a href="search.php$session[sessionurl_q]" accesskey="4">$vbphrase[search]</a></td>
<if condition="$show['member']">
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getnew" accesskey="2">$vbphrase[new_posts_nav]</a></td>
<else />
<td class="vbmenu_control"><a href="search.php?$session[sessionurl]do=getdaily" accesskey="2">$vbphrase[todays_posts]</a></td>
</if>
</if>
<td class="vbmenu_control"><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a></td>
<if condition="$show['member']">
<td class="vbmenu_control"><a href="#" onclick="window.open('misc.php?$session[sessionurl]do=buddylist&focus=1','buddylist','statusbar=no,me nubar=no,toolbar=no,scrollbars=yes,resizable=yes,w idth=250,height=300'); return false;">$vbphrase[open_contacts]</a></td>
</if>
</if>
$template_hook[navbar_buttons_right]
<if condition="$show['member']">
<td class="vbmenu_control"><a href="login.php?$session[sessionurl]do=logout&logouthash=$bbuserinfo[logouthash]" onclick="return log_out('$vbphrase[sure_you_want_to_log_out]')">$vbphrase[log_out]</a></td>
</if>
</tr>
</table>
</div>
<!-- / nav buttons bar -->
</td>
</tr>
</table>
<!-- /logo -->
<!-- content table -->
$spacer_open
$_phpinclude_output
$ad_location[ad_header_end]
Note: In the above code, I've only customised up to and including the 'Community' link.
As you can see, I'm trying to use onmouseover / onmouseout events to change the TD background. It works perfectly for all buttons except Community, Search and Quick Links, which all use drop down menus.
I think this may be due to the popup Javascript for these navbar entries interfering with my onmouseover / onmouseout code.
Can someone please tell me how I can get this to work? I've seen this done in a lot of custom styles (i.e. http://www.vbstyles.com/demo/index.php?styleid=28 )
Thanks!
--------------- Added 1232262163 at 1232262163 ---------------
Edit: Never mind, fixed with https://vborg.vbsupport.ru/showpost.php?p=1204408&postcount=5