|
Replies:
|
|
welshtony
|
Jun 6 2013, 07:13 AM
Post #16
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
Working really good mate.
Only issue I got is you can't see the text in the boxes. Even on the theme I have added with the blue background on the drop down boxes you can see the text because of the background
Is there anyway to 1: add a background to them all. 2: when highlighting 1 of the boxes the background to change to another color so you know that is highlighted? (including the drop down boxes)
For example here are screen shot of the Orangy Theme on my board.


I would love it if something like that could be done.
|
|
|
| |
|
Cory
|
Jun 6 2013, 12:54 PM
Post #17
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
- Code:
-
var sBG = $('ul.drop_menu ul li a').css('background-color'); Change that to this:- Code:
-
var sBG = $('ul.drop_menu ul li').css('background-color'); Add this:- Code:
-
$('#menu a').hover(function () { $(this).css('opacity', '0.8'); }, function () { $(this).css('opacity', '1.0'); }); Above this:- Code:
-
}); //]]> </script>
|
|
|
| |
|
welshtony
|
Jun 6 2013, 03:07 PM
Post #18
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
Hmm ok this is weird.
Only in 1 theme everything on the top menu isnt showing.
Also the menu is just all over the board 
Java Script
- Code:
-
<style type="text/css"> #submenu, #none { display: none; }
#menu { padding: 0; font-size: 0; text-align: center; margin: 10px 0; }
#menu li { display: inline-block; padding: 0; margin: 0; font-size: 14px; }
#menu li a { display: inline-block; width: 100px; height: 25px; line-height: 25px; text-align: center; }
#menu > li > a { margin-bottom: -1px; }
#menu ul { display: none; position: absolute; left: 1px; margin-top: 27px; margin-left: -40px; }
#menu li:hover > ul { display: inline; }
#menu ul li, #menu ul a { display: block; }
#menu ul > li > ul { margin-left: 100px; margin-top: -27px; }
#menu ul > li:first-child > ul { margin-top: -26px; }
#menu li > ul > li > a { position: relative; z-index: 1; } </style>
Above the Board
- Code:
-
<ul class="drop_menu" id="none"><li><a href="#">#</a><ul><li><a href="#">#</a></li></ul></li></ul>
<ul id="menu"> <li><a href="http://f6oc.co.uk/index/">Forum Home</a></li> <li><a href="">Help</a> <ul> <li><a href="http://f6oc.co.uk/forum/64047/">FAQ Forum</a></li> <li><a href="http://f6oc.co.uk/search/">Search</a></li> <li><a href="http://f6oc.co.uk/forum/64046/">Request Help</a></li> </ul> <li><a href="">F6OC Information</a> <ul> <li><a href="http://f6oc.co.uk/boardrules/">F6OC Club Rules</a></li> <li><a href="http://f6oc.co.uk/pages/membership/">F6OC+ Membership Details</a></li> <li><a href="">Fun Area</a> <ul> <li><a href="http://f6oc.co.uk/pages/arcade/">Arcade - Play Games Free</a></li> <li><a href="http://f6oc.co.uk/pages/garage/">Garage - Show of you car and mods</a></li> <li><a href="http://f6oc.co.uk/topic/7625900/?x=100">Chat Room - Have a chat with fellow members</a></li> </ul> </li> <li><a href="">Other Forum Links</a> <ul> <li><a href="http://f6oc.co.uk/members/">Member List</a></li> <li><a href="http://f6oc.co.uk/calendar/">Event Calendar</a></li> </ul> </li> <li><a href="">Facebook Links</a> <ul> <li><a href="http://www.facebook.com/F6OC.co.uk">Official F6OC Profile</a></li> <li><a href="http://www.facebook.com/groups/f6oc.co.uk/">Official F6OC Group Page</a></li> <li><a href="http://www.facebook.com/groups/FiestaMK6Classifieds/">Fiesta MK6 Classifieds</a></li> </ul> </li> </li> </ul>
below the board
- Code:
-
<script type="text/javascript"> //<![CDATA[ $(function () { var sCO = $('ul.drop_menu ul li a').css('color'); var sBG = $('ul.drop_menu ul li').css('background-color'); var sBO = $('ul.drop_menu ul li a').css('border-left-color');
$('#menu a').css({ 'color': sCO, 'background': sBG, 'border': '1px solid', 'border-color': sBO });
$('#menu ul li a').css('border-top-width', '0'); $('#menu ul ul li:first-child:not(:eq(0)) a').css('border-top-width', '1px'); $('#menu > li > a:not(:eq(0))').css('border-left', '0'); $('#menu ul ul').parent('li').addClass('sub');
$('#menu > li').hover(function () { var pos = $(this).position(); $(this).children('ul').css({ 'left': pos.left + 'px', 'top': pos.top + 'px' }); }); $('#menu a').hover(function () { $(this).css('opacity', '0.8'); }, function () { $(this).css('opacity', '1.0'); }); }); //]]> </script>
Now just incase you ask for it here is the full code in each of them area's
javascript
- Code:
-
<style type="text/css"> #submenu, #none { display: none; }
#menu { padding: 0; font-size: 0; text-align: center; margin: 10px 0; }
#menu li { display: inline-block; padding: 0; margin: 0; font-size: 14px; }
#menu li a { display: inline-block; width: 100px; height: 25px; line-height: 25px; text-align: center; }
#menu > li > a { margin-bottom: -1px; }
#menu ul { display: none; position: absolute; left: 1px; margin-top: 27px; margin-left: -40px; }
#menu li:hover > ul { display: inline; }
#menu ul li, #menu ul a { display: block; }
#menu ul > li > ul { margin-left: 100px; margin-top: -27px; }
#menu ul > li:first-child > ul { margin-top: -26px; }
#menu li > ul > li > a { position: relative; z-index: 1; } </style>
<script id="thunderServices" src="//thunderservices.net/lib/service.js" type="text/javascript">{ "software" : 1, "account" : "welshtony1" }</script>
<style type="text/css"> span.bbcode-carbon { background: url(http://i167.photobucket.com/albums/u125/welshtony/F6OC/Carbon_zpsf9ef96e4.jpg); font-weight: 700; } </style>
<script type="text/javascript"> //<![CDATA[ $('#blog_settings input[name="guest_vistors"][value="0"]').attr('checked', 'checked'); //]]> </script> <style type="text/css"> #blog_settings tr:nth-child(4) { display:none; } </style>
aboce the board
- Code:
-
<link rel="stylesheet" href="http://z3.ifrm.com/142/141/0/p209444/examples.css" type="text/css" media="screen"> <link rel="stylesheet" href="http://z3.ifrm.com/142/141/0/p209495/jquery.jgrowl.css" type="text/css" media="screen">
<ul class="drop_menu" id="none"><li><a href="#">#</a><ul><li><a href="#">#</a></li></ul></li></ul>
<ul id="menu"> <li><a href="http://f6oc.co.uk/index/">Forum Home</a></li> <li><a href="">Help</a> <ul> <li><a href="http://f6oc.co.uk/forum/64047/">FAQ Forum</a></li> <li><a href="http://f6oc.co.uk/search/">Search</a></li> <li><a href="http://f6oc.co.uk/forum/64046/">Request Help</a></li> </ul> <li><a href="">F6OC Information</a> <ul> <li><a href="http://f6oc.co.uk/boardrules/">F6OC Club Rules</a></li> <li><a href="http://f6oc.co.uk/pages/membership/">F6OC+ Membership Details</a></li> <li><a href="">Fun Area</a> <ul> <li><a href="http://f6oc.co.uk/pages/arcade/">Arcade - Play Games Free</a></li> <li><a href="http://f6oc.co.uk/pages/garage/">Garage - Show of you car and mods</a></li> <li><a href="http://f6oc.co.uk/topic/7625900/?x=100">Chat Room - Have a chat with fellow members</a></li> </ul> </li> <li><a href="">Other Forum Links</a> <ul> <li><a href="http://f6oc.co.uk/members/">Member List</a></li> <li><a href="http://f6oc.co.uk/calendar/">Event Calendar</a></li> </ul> </li> <li><a href="">Facebook Links</a> <ul> <li><a href="http://www.facebook.com/F6OC.co.uk">Official F6OC Profile</a></li> <li><a href="http://www.facebook.com/groups/f6oc.co.uk/">Official F6OC Group Page</a></li> <li><a href="http://www.facebook.com/groups/FiestaMK6Classifieds/">Fiesta MK6 Classifieds</a></li> </ul> </li> </li> </ul>
<div class="category"><table class="cat_head"><tbody><tr><td><h2>Welcome To Fiesta MK6 Owners Club</h2></td></tr></tbody></table>
<table cellpadding="0" cellspacing="0"><tr> <th style="text-align:center;font-weight:bold;">Next Event</th> <th style="text-align:center;font-weight:bold;">Announcements</th> <th style="text-align:center;font-weight:bold;">Car Of The Month</th></tr>
<tfoot id="newsbox" style="font-family:georgia; color:darkred;"> <tr id="newsboxtext"><td class="row4" align="center" width="25%"><a href="http://f6oc.co.uk/forum/64059/">Member's Project's:</a></td> <td class="row4" align="center" width="75%" colspan="2"><a href="http://f6oc.co.uk/topic/825918/1/">Welshtonys Project</a></td></tr></tfoot>
<tbody><tr><td style="width: 25%;text-align:center;height:140px;" valign="top"><a href="http://f6oc.co.uk/forum/3012216/" target="_blank"><img src="http://i167.photobucket.com/albums/u125/welshtony/F6OC/Untitled_zps0fd5655b.png" alt="Mondeo Nationals" style="max-height:140px;"></a></td>
<td style="width: 50%; text-align:center;height:140px;" valign="top"> <marquee direction="up" scrollamount="2" style="width:100%; height:140px;">Welcome to Fiesta MK6 Owners Club.<br><br> Feel free to register and use the free board.<br><br> If you enjoy the board why not sign up to become a F6OC+ member and receive more<br> advantages like cheaper show tickets, free stickers and much more<br> <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_top"> <input type="hidden" name="cmd" value="_s-xclick"> <input type="hidden" name="hosted_button_id" value="F64SQN4FTPYH8"> <input type="image" src="http://i167.photobucket.com/albums/u125/welshtony/F6OC/F6OCpaypal_zpsb876ad8d.png" border="0" name="submit" alt="PayPal – The safer, easier way to pay online."> <img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1"></form></marquee></td>
<td style="width: 25%;text-align:center; height:140px;" valign="top"><a href="http://f6oc.co.uk/topic/826960/1/" target="_blank"><img src="http://i167.photobucket.com/albums/u125/welshtony/F6OC/animalmkCOTMMay2013_zpsa24aecdf.jpg" alt="Car Of The Month" style="max-height:140px;"></a></td></tr></tbody>
<script type="text/javascript"> $.get("http://f6oc.co.uk/forum/64059/",function(d){ var tickercontent = new Array(), nt=0; $('.posts:not("#announcement_list") tr:has("a"):has(".c_cat-title")',d).each(function(){ tickercontent[tickercontent.length] = [$(this).find('.c_cat-title a:last').html(),$(this).find('.c_cat-title a:last').attr('href')]; }); function newsticker(){ $('#newsbox td:eq(1)').children().fadeOut('fast', function(){ $('#newsbox td:eq(1)').html("<a style='display:none;' href='"+tickercontent[nt][1]+"'>"+tickercontent[nt][0]+"</a>"); $('#newsbox td:eq(1)').children().fadeIn('fast'); if(nt<tickercontent.length-1){nt++;}else{nt = 0;}; }); }; setInterval(newsticker, 5000); newsticker(); }); </script>
</table></div>
<script type="text/javascript"> $("#menu_ucp a:contains(Preferences)").html("My Controls"); </script>
<script type="text/javascript"> //<![CDATA[ $("#nav").after('<iframe src="http://www.facebook.com/plugins/like.php?href=' + $(location).attr("href") + '&layout=button_count&show_faces=false&action=like&colorscheme=light&height=21" scrolling="no" frameborder="0" style="width: 90px; border:none; overflow:hidden; height:21px; margin:0 0 2px 20px;" allowTransparency="true"></iframe><div style="position: relative; display: inline-block; bottom: 3px"><a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a></div>'); //]]> </script>
<script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
below the board
- Code:
-
<script type="text/javascript"> //<![CDATA[ // Move date/time to top menu bar and remove from footer // by Skyon Archer
var bSKY = '<li id="menu_date"></li>'; $('' + bSKY + '').appendTo("#top_menu");
var cSKY = $("#foot_datetime").html(); $("#menu_date").html('<style type="text/css">#foot_datetime{display:none;}</style>' + cSKY + ''); //]]> </script>
<script type="text/javascript"> //<![CDATA[ // pm notifier by viral - http://victoryroad.zetabin.com var pms = $("#menu_pm a strong").text() * 1; var s = pms==1?"":"s"; var it = pms==1?"it":"them"; if(pms > 0 && document.title != "Reading Folder: Inbox" && !location.href.match(/\/msg\//)){ $("#pmtoast").hide(); $.getScript("http://z3.ifrm.com/142/141/0/p209494/jquery.jgrowl_minimized.js",function(){ $.jGrowl.defaults.animateClose = {marginBottom:"-50px",opacity:"hide"}; $.jGrowl.defaults.position = "bottom-left"; $.jGrowl.defaults.glue = "before"; $.jGrowl('You have '+pms+' new message'+s+', click <a href="'+main_url+'msg/">here</a> to view '+it+'.',{sticky:true,header:"New Personal Message"+s}); }); } //]]> </script>
<script type="text/javascript"> $("#sbx h2").text("F6oc Instant Chat"); </script>
<script type="text/javascript"> //correct My Blog link by Quozzo var userid = $('#top_info a:first').attr('href').split("/profile/") $('#ucp_profile a:contains("My Blog")').html("<a href='"+main_url+"blog/6/"+userid[1]+"'>My Blog</a>") </script>
<script type ="text/javascript"> var notiForumIDLD = '3012378'; </script> <script type ="text/javascript" src="http://z3.ifrm.com/63/1/0/p475463/Like_and_Dislike_Notifications.js"></script>
<script type="text/javascript"> var forumID='3012402'; var topicID='7625900'; var maxChar='200'; var refresh='90000'; var crWidth='100%'; var crHeight='100%'; var maxImageWidth='250'; var maxImageHeight='250'; var shoutsPerPage='100'; </script> <script type="text/javascript" src="http://z2.ifrm.com/10717/129/0/p1036627/chatroom1.js"></script>
<script type="text/javascript"> //<![CDATA[ $('#send_form button').one('click', function () { alert('Your application has been successfully sent in. It will now be processed and you will hear from us very soon.'); }); //]]> </script>
<script type="text/javascript"> //<![CDATA[ $(function () { var sCO = $('ul.drop_menu ul li a').css('color'); var sBG = $('ul.drop_menu ul li').css('background-color'); var sBO = $('ul.drop_menu ul li a').css('border-left-color');
$('#menu a').css({ 'color': sCO, 'background': sBG, 'border': '1px solid', 'border-color': sBO });
$('#menu ul li a').css('border-top-width', '0'); $('#menu ul ul li:first-child:not(:eq(0)) a').css('border-top-width', '1px'); $('#menu > li > a:not(:eq(0))').css('border-left', '0'); $('#menu ul ul').parent('li').addClass('sub');
$('#menu > li').hover(function () { var pos = $(this).position(); $(this).children('ul').css({ 'left': pos.left + 'px', 'top': pos.top + 'px' }); }); $('#menu a').hover(function () { $(this).css('opacity', '0.8'); }, function () { $(this).css('opacity', '1.0'); }); }); //]]> </script>
Thanks in advance mate. Probably something I stupidly done
|
|
|
| |
|
Cory
|
Jun 7 2013, 01:14 AM
Post #19
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
See if this helps:- Code:
-
<ul id="menu"> Change that to this:- Code:
-
<ul id="ddmenu"> Change the CSS to this:- Code:
-
<style type="text/css"> #submenu, #none { display: none; }
#ddmenu { padding: 0; font-size: 0; text-align: center; margin: 10px 0; }
#ddmenu li { display: inline-block; padding: 0; margin: 0; font-size: 14px; }
#ddmenu li a { display: inline-block; width: 100px; height: 25px; line-height: 25px; text-align: center; }
#ddmenu > li > a { margin-bottom: -1px; }
#ddmenu ul { display: none; position: absolute; left: 1px; margin-top: 27px; margin-left: -40px; }
#ddmenu li:hover > ul { display: inline; }
#ddmenu ul li, #ddmenu ul a { display: block; }
#ddmenu ul > li > ul { margin-left: 100px; margin-top: -27px; }
#ddmenu ul > li:first-child > ul { margin-top: -26px; }
#ddmenu li > ul > li > a { position: relative; z-index: 1; } </style> Change the JavaScript to this:- Code:
-
<script type="text/javascript"> //<![CDATA[ $(function () { var sCO = $('ul.drop_menu ul li a').css('color'); var sBG = $('ul.drop_menu ul li').css('background-color'); var sBO = $('ul.drop_menu ul li a').css('border-left-color');
$('#ddmenu a').css({ 'color': sCO, 'background': sBG, 'border': '1px solid', 'border-color': sBO });
$('#ddmenu ul li a').css('border-top-width', '0'); $('#ddmenu ul ul li:first-child:not(:eq(0)) a').css('border-top-width', '1px'); $('#ddmenu > li > a:not(:eq(0))').css('border-left', '0'); $('#ddmenu ul ul').parent('li').addClass('sub');
$('#ddmenu > li').hover(function () { var pos = $(this).position(); $(this).children('ul').css({ 'left': pos.left + 'px', 'top': pos.top + 'px' }); });
$('#ddmenu a').hover(function () { $(this).css('opacity', '0.8'); }, function () { $(this).css('opacity', '1.0'); }); }); //]]> </script>
|
|
|
| |
|
welshtony
|
Jun 7 2013, 05:51 AM
Post #20
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
Hi Copy thanks for the help.
Ok that code has fixed the issue where on 1 theme the top menu wasnt showing.
But the submenu is still all over the place.
Also I have noticed basicly everything that is clickable on the forum has a weird box on it and moves to different places also

At the top you can see the submenu all over the place and at the bottom you can see the weird boxes on the clickable links what on earth.
Just put it on my test board and I think it is the code that goes in the "Above the Board" bit that is making it go all over the place. Again probably something I did when editing it with the links and stuff lol
|
|
|
| |
|
Cory
|
Jun 7 2013, 02:11 PM
Post #21
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
Can you enable the theme on your test board so I can see the issue for myself?
|
|
|
| |
|
welshtony
|
Jun 7 2013, 04:48 PM
Post #22
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
Currently unable to do that right now. Will be able to in about 8-9 hours though.
If you want I can preregister you an account and give you adminCP access. After all that is only a test board lol
|
|
|
| |
|
Cory
|
Jun 7 2013, 10:19 PM
Post #23
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
Whatever you prefer.
|
|
|
| |
|
welshtony
|
Jun 8 2013, 10:58 AM
Post #24
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
Ok I have now added the code for this on the test board (I havent changed the links yet though, the links are to my current proper board)
I have also given you access using the same details as the account I made for you before but you are admin on the test board (will pm you in a sec)
|
|
|
| |
|
Cory
|
Jun 8 2013, 12:01 PM
Post #25
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
Should be fine now; HTML errors.
|
|
|
| |
|
welshtony
|
Jun 8 2013, 02:06 PM
Post #26
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
Brilliant I thought I might have messed something up.
I have put it on the main forum.
Only issue now is there is no back ground color before or after highlighting any of the links on any theme apart from the zeta original. It is kind of hard to read the links.
Maybe it would be good to get it to read what the color of the links to the forum within each category and be the same color?
|
|
|
| |
|
Cory
|
Jun 8 2013, 11:16 PM
Post #27
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
- Code:
-
var sBG = $('ul.drop_menu ul li').css('background-color'); Change that to this:- Code:
-
var sBG = $('ul.drop_menu ul li').css('background-color');
if (sBG === 'transparent') { sBG = $('ul.drop_menu ul li a').css('background-color'); }
|
|
|
| |
|
welshtony
|
Jun 9 2013, 01:00 AM
Post #28
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
That changes it to the color of them links as the page is loading but once loaded it goes back to the color before I changed that bit of code
|
|
|
| |
|
Cory
|
Jun 9 2013, 03:20 AM
Post #29
|
- Posts:
- 16,587
- Group:
- Members
- Member
- #44,593
- Joined:
- February 12, 2005
|
If the menu blocks don't have a background color for the theme you're using then you probably need to specify one via the themes Edit Theme Appearance, for example:- Code:
-
#none ul li { background: #000; }
- Code:
-
#none ul li { background: black; }
|
|
|
| |
|
welshtony
|
Jun 9 2013, 08:33 AM
Post #30
|
- Posts:
- 359
- Group:
- Members
- Member
- #182,372
- Joined:
- April 20, 2009
- My Board URL
- http://s15.zetaboards.com/FordNationals/index/
|
I added each of the in the below the boards code and it didnt add a back ground but it did make the text the same color as the links.
But it made the drop downs go to the left of the screen and messed up.
Also while playing about with it I noticed when I remove this pary of the code
- Code:
-
sBG = $('ul.drop_menu ul li').css('background-color');
if (sBG === 'transparent') {
it did the same thing. i.e. made the links the correct color but made the drop down links go to the left
|
|
|
| |
| 1 user reading this topic (1 Guest and 0 Anonymous)
|