Posts: 850
Name: Matt Pealing
Location: England, north west
|
I'm trying to get lavaLamp to work using this tutorial http://www.gmarwaha.com/blog/2007/08...jquery-lovers/
Here is the code I have so far:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
/* Styles for the entire LavaLamp menu */
.lavaLamp {
position: relative;
height: 29px; width: 421px;
background: black;
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: red;
width: 9px; height: 30px;
z-index: 8;
position: absolute;
}
.lavaLamp li.back .left {
background: red;
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;
}
</style>
<script type="text/javascript" src="script/js/jquery.js"></script>
<script type="text/javascript" src="script/js/jquery.lavalamp.js"></script>
<!-- Optional -->
<script type="text/javascript" src="script/js/jquery.easing.js"></script>
<script type="text/javascript">
$(function() { $(".lavaLamp").lavaLamp({ fx: "backout", speed: 700 })});
</script>
</head>
<body>
<ul class="lavaLamp">
<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>
But it doesn't work! When I hover over a link in the menu the error console presents this error message (4 times)
Quote:
Error: o.easing[this.options.easing || (o.easing.swing ? "swing" : "linear")] is not a function
Source File: file:///C:/Users/Pealo/Documents/design/2009/mrphotography.biz/script/js/jquery.js
Line: 19
|
I dont have a clue where the problem could be though! |
