cerberus478 Posted July 30, 2012 Share Posted July 30, 2012 Hi I'm trying to do a lavalamp style menu but it isn't working here is my home page <html> <head> <title>Menu</title> <script type="text/javascript" src="../jquery/lavalamp/jquery.js"></script> <script type="text/javascript" src="../jquery/lavalamp/jquery.lavalamp.js"></script> <!-- Optional --> <script type="text/javascript" src="../jquery/lavalamp/jquery.easing.js"></script> <script type="text/javascript"> $(function() { $(".lavaLamp").lavaLamp({ fx: "backout", speed: 700 })}); }); </script> <link rel="stylesheet" type="text/css" href="css/menu.css" media="screen" /> </head> <body> <ul class="lavaLamp"> <li class="back"><div class="left"></div></li> <li><a href="#">Home</a></li> <li><a href="#">Plant a tree</a></li> <li><a href="#">Travel</a></li> <li><a href="#">Ride an elephant</a></li> </ul> </body> </html> and this is my menu.css /* Styles for the entire LavaLamp menu */ .lavaLamp { position: relative; height: 29px; width: 421px; background: url("../jquery/lavalamp/bg.gif") no-repeat top; padding: 15px; margin: 10px 0; overflow: hidden; } /* Force the list to flow horizontally */ .lavaLamp li { float: left; list-style: none; } /* Represents the background of the highlighted menu-item. */ .lavaLamp li.back { background: url("../jquery/lavalamp/lava.gif") no-repeat right -30px; width: 9px; height: 30px; z-index: 8; position: absolute; } .lavaLamp li.back .left { background: url("../jquery/lavalamp/lava.gif") no-repeat top left; height: 30px; margin-right: 9px; } /* Styles for each menu-item. */ .lavaLamp li a { position: relative; overflow: hidden; text-decoration: none; text-transform: uppercase; font: bold 14px arial; color: #fff; outline: none; text-align: center; height: 30px; top: 7px; z-index: 10; letter-spacing: 0; float: left; display: block; margin: auto 10px; } Link to comment https://forums.phpfreaks.com/topic/266459-lavalamp-problem/ Share on other sites More sharing options...
Adam Posted July 30, 2012 Share Posted July 30, 2012 Can you explain what exactly isn't working? Link to comment https://forums.phpfreaks.com/topic/266459-lavalamp-problem/#findComment-1365517 Share on other sites More sharing options...
cerberus478 Posted July 31, 2012 Author Share Posted July 31, 2012 When I hover over the link the bubble that suppose to appear doesn't appear. Link to comment https://forums.phpfreaks.com/topic/266459-lavalamp-problem/#findComment-1365619 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.