PDA

View Full Version : Anylink CSS Second Level dropdown Problem



bjsudipta
02-16-2013, 11:07 AM
My Problem:

I'm using following code in my HEAD tag:




<link href="css/inner.css" rel="stylesheet" type="text/css" />

<link rel='stylesheet' id='style-css' href='css/diapo.css' type='text/css' media='all'>
<script type='text/javascript' src='scripts/jquery.min.js'></script>
<!--[if !IE]><!--><script type='text/javascript' src='scripts/jquery.mobile-1.0rc2.customized.min.js'></script><!--<![endif]-->
<script type='text/javascript' src='scripts/jquery.easing.1.3.js'></script>
<script type='text/javascript' src='scripts/jquery.hoverIntent.minified.js'></script>
<script type='text/javascript' src='scripts/diapo.js'></script>

<script>
$(function(){
$('.pix_diapo').diapo();
});

</script>




<!--dropdown start-->
<link rel="stylesheet" type="text/css" href="css/anylinkcssmenu.css" />

<script type="text/javascript" src="anylinkcssmenu.js">

/***********************************************
* AnyLink CSS Menu script v2.0- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Project Page at http://www.dynamicdrive.com/dynamicindex1/anylinkcss.htm for full source code
***********************************************/

</script>

<script type="text/javascript">

//anylinkcssmenu.init("menu_anchors_class") ////Pass in the CSS class of anchor links (that contain a sub menu)
anylinkcssmenu.init("anchorclass")
</script>
<!--dropdown end-->




I'm also put this code inside my BODY tag:




<table width="680" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="104" height="48" align="center" valign="middle"><a href="about-leapfx.html" class="anchorclass" rel="submenu1">About LeapFx</a>

<div id="submenu1" class="anylinkcss">
<ul>
<li><a href="about-leapfx.html">About Us</a></li>
<li><a href="licensing-regulation.html">Licensing, Regulation, and Security of Funds</a></li>
<li><a href="legal.html">Legal Documentation</a></li>
<li><a href="company-news.html">Company News</a></li>
<li><a href="press-release.html">Press Releases</a></li>
<li><a href="career-opportunities.html">Career Opportunities</a></li>
<li><a href="contact-us.html">Contact Us</a></li>
</ul>
</div>

</td>
<td width="111" height="48" align="center" valign="middle">

<a href="partnership.html" class="anchorclass" rel="submenu2">Why LeapFx</a>

<div id="submenu2" class="anylinkcss">
<ul>
<li><a href="advantages.html">Advantages Of Leap FX</a></li>
<li><a href="why-leap-fx-metal.html">Trading Metals</a></li>
<li><a href="currency-pairs.html">Currency Pairs</a></li>
<li><a href="swap-rates.html">Swap Rates</a></li>
<li><a href="spreads.html">Spreads</a></li>
<li><a href="promotions.html" class="anchorclass" rel="submenu2a">Promotions</a>

<ul id="submenu9" class="anylinkcss">
<li><a href="ib-prog.html">Introducing Broker (IB) Program</a></li>
<li><a href="pamm-prog.html">Money Manager (PAMM) Program</a></li>
<li><a href="white-label.html">White Label Program</a></li>
</ul>

</li>
</ul>
</div>

</td>
<td width="151" height="48" align="center" valign="middle">

<a href="accounts-trading.html" class="anchorclass" rel="submenu6">Accounts &amp; Trading</a>

<div id="submenu6" class="anylinkcss">
<ul>

<li><a href="live-trading.html">Open Live Trading Account</a></li>
<li><a href="demo-trading.html">Open Demo Trading Account</a></li>
<li><a href="islamic-trading.html">Islamic Trading Account</a></li>
<li><a href="fix.html">FIX/API</a></li>
<li><a href="meta-trader-api.html">Meta Trader API</a></li>
<li><a href="vps-service.html">VPS Service</a></li>
</ul>
</div>

</td>
<td width="155" height="48" align="center" valign="middle">

<a href="trading-platforms.html" class="anchorclass" rel="submenu3">Trading Platforms</a>

<div id="submenu3" class="anylinkcss">
<ul>
<li><a href="meta-trader-4.html">Meta Trader 4</a></li>
<li><a href="meta-trader-4-mobi.html">Meta Trader 4 Mobile</a></li>
<li><a href="meta-trader-4-mam.html">Meta Trader 4 MAM</a></li>
</ul>
</div>

</td>

<td width="159" height="48" align="center" valign="middle">

<a href="client-resources.html" class="anchorclass" rel="submenu5">Customer Resources</a>

<div id="submenu5" class="anylinkcss">
<ul>
<li><a href="client-login.html">Customer Login</a></li>
<li><a href="vps-login.html">VPS Login</a></li>
<li><a href="downloads.html">Downloads</a></li>
<li><a href="funding.html">Funding</a></li>
<li><a href="withdrawl.html">Withdrawal</a></li>
</ul>
</div>

</td>

</tr>
</table>





<div class="pix_diapo">

<div data-thumb="images/thumbs/gal1-thumb.jpg">
<div class="gal-1-bg">
<div class="gal1-learn-btn-a"><a href="#"><img src="images/why-leap-fx-ad.png" alt="" width="216" height="54" border="0" /></a></div>
<div class="open-acc-tab">
<a href="#"><img src="images/live-trading-btn.png" alt="" width="167" height="40" border="0" class="live-btn" /></a>
<a href="#"><img src="images/demo-acc-btn.png" alt="" width="167" height="40" border="0" class="demo-btn" /></a>
</div>
</div>
</div>

<div data-thumb="images/thumbs/gal2-thumb.jpg">
<div class="gal-2-bg">
<div class="open-acc-tab">
<a href="#"><img src="images/live-trading-btn.png" alt="" width="167" height="40" border="0" class="live-btn" /></a>
<a href="#"><img src="images/demo-acc-btn.png" alt="" width="167" height="40" border="0" class="demo-btn" /></a>
</div>
</div>
</div>

<div data-thumb="images/thumbs/gal3-thumb.jpg">
<div class="gal-3-bg">
<div class="open-acc-tab">
<a href="#"><img src="images/live-trading-btn.png" alt="" width="167" height="40" border="0" class="live-btn" /></a>
<a href="#"><img src="images/demo-acc-btn.png" alt="" width="167" height="40" border="0" class="demo-btn" /></a>
</div>
</div>
</div>

<div data-thumb="images/thumbs/gal4-thumb.jpg">
<div class="gal-4-bg">
<div class="gal4-learn-btn"><a href="#"><img src="images/about-leap-fx-se.png" alt="" width="195" height="54" border="0" /></a></div>
<div class="open-acc-tab">
<a href="#"><img src="images/live-trading-btn.png" alt="" width="167" height="40" border="0" class="live-btn" /></a>
<a href="#"><img src="images/demo-acc-btn.png" alt="" width="167" height="40" border="0" class="demo-btn" /></a>
</div>
</div>
</div>

<div data-thumb="images/thumbs/gal5-thumb.jpg">
<div class="gal-5-bg">
<div class="gal1-learn-btn-a"><a href="#"><img src="images/why-leap-fx-ad.png" alt="" width="216" height="54" border="0" /></a></div>
<div class="open-acc-tab">
<a href="#"><img src="images/live-trading-btn.png" alt="" width="167" height="40" border="0" class="live-btn" /></a>
<a href="#"><img src="images/demo-acc-btn.png" alt="" width="167" height="40" border="0" class="demo-btn" /></a>
</div>
</div>
</div>




</div>





But My second label drop-down not working.

Please guide me, how to solve this problem?

Moderator's Note: I've edited it for you this time. In future, please use the # button for code, not the i# one. i# highlights and is good for one liners. # puts the code in a distinct block.

jscheuer1
02-16-2013, 12:01 PM
If you mean a second level drop down, that script doesn't do that. You need one from the multilevel menu section:

http://www.dynamicdrive.com/dynamicindex1/indexc.html

If it's some other problem, please include a link to the page on your site that contains the problematic code so we can check it out.

bjsudipta
02-18-2013, 09:41 AM
I'm trying to using those 2 pages:
http://www.design4banners.com/leapfx/index-sample.html
and
http://www.design4banners.com/leapfx/index-sample1.html

On the http://www.design4banners.com/leapfx/index-sample.html pages, dropdown works perfectly, but Gallery Not Working

and

On the http://www.design4banners.com/leapfx/index-sample1.html pages, nothing is works perfectly.

Please give me a proper wayout.

I hope you will guide me properly.

jscheuer1
02-18-2013, 06:49 PM
After I first responded, I managed to run the code from your post. You are trying to have a second level drop down, and as I say this script doesn't do that. Try one of the scripts from the multilevel library I linked you to in my last post. This one (smooth menu) is pretty good:

http://www.dynamicdrive.com/dynamicindex1/ddsmoothmenu.htm

And is soon to be updated to be even better with bug fixes, enhancements, detection of touch devices, optional activation on hover or click of the menu items.

ddadmin has indicated to me he will be using my update. We just got finished getting rid of the last bug we could find. Now I think all that's left is putting it in the library and explaining its usage, which is slightly different than the current version smooth menu.

If you like the current version of smooth menu, I have the update now and can walk you through updating it to the newer version smooth menu.

icoso
08-06-2013, 07:41 PM
As a folowup to this post - What is this code used for?

//anylinkcssmenu.init("menu_anchors_class")

in the following:
<script type="text/javascript">

//anylinkcssmenu.init("menu_anchors_class") ////Pass in the CSS class of anchor links (that contain a sub menu)
anylinkcssmenu.init("anchorclass")
</script>
<!--dropdown end-->

It appears to be used to create a submenu if the // are removed and used as the anchor class when defining a menu in a div to add a "sub-menu" ie:

If I have this:
<div id="loansmenu" class="anylinkcss">
<ul>
<li><a href="?FID=ln-loanapps.html">Loan Applications</a></li>
<li><a href="?FID=calcl.html">Loan Calculator</a></li>
<li><a href="?FID=ln-autobuying.html" class="menu_anchors_class" rel="autobuymenu" rev="lr">Auto Buying</a></li>
<li><a href="?FID=ln-homeeq.html">Home Equities</a></li>
<li><a href="?FID=ln-students.html">Student Loans</a></li>
<li><a href="?FID=ln-creditcards.html">Credit Cards</a></li>
<li><a href="?FID=ln-mortgages.html">Mortages</a></li>
<li><a href="?FID=calcm.html">Mortgage Calculator</a></li>
<li><a href="?FID=ln-skipapay.html">Skip-A-Payment</a></li>
</ul>
</div>

and this:

<div id="autobuymenu" class="anylinkcss">
<ul>
<li><a href="?FID=ln-cudl.html">CUDL Autosmart</a></li>
<li><a href="?FID=ln-warranty.html">Extended Warranty</a></li>
<li><a href="?FID=ln-carfax.html">CarFax Reports</a></li>
<li><a href="?FID=ln-autobroker.html">Auto Broker</a></li>
</ul>
</div>

I get a submenu off to the right of my Auto Buying dropdown menu, but the dropdown menu that Auto Buying is listed in disappears when I mouse over the the autobuymenu submenu. You can view this at: https://www.linkfcu.org/NewSite/ the Atuobuy menu is under the Loans main menu item. (I haven't added any CSS formatting to the main menu yet).

How can I get the first Dropdown menu to not disappear?

jscheuer1
08-06-2013, 09:14 PM
In the future, please start a new thread for what is essentially a new question. It might be about the same menu, but even if it is (there are at least two current versions of anylink here on DD and there have been various versions of each of those in the past), you are still asking a different question.

In this case I will answer and close this thread. If you have a follow up to your own question, please start a new thread for that and follow the posting guidelines for a new thread.

That said, anything in javascript code that begins a line with // is a comment and/or instructions. So that is all that line is for. In this case a template for for an anylinkcssmenu.init() call.