This code works is FF and IE but not in Chrome. Any help would be greatly appreciated.
Thank You!
here is the html
Item One
Item Two
Item Three
Item Four
Item Five
Item Six
Item Seven
Item Eight
Item Nine
Item ten
here is the css
popularsearches
{
border-bottom: 1px solid #D4D4D4;
border-left: 1px solid #D4D4D4;
border-right: 1px solid #D4D4D4;
overflow:hidden;
height: 130px;
width:248px;
margin-bottom:20px;
}
popularsearches ul
{
padding:0 5px 0 0;
margin:0;
}
popularsearches ul li
{
list-style-type:none;
list-style-position:inside;
border-bottom: solid 1px #D4D4D4;
font-size:14px;
padding:3px 0 3px 0;
margin:0 0 0 10px;
text-align:left;
}
popularsearches ul li a
{
text-decoration:none;
}
popularsearches ul li a:hover, a:link, a:visited
{
text-decoration:none;
}
popularsearches-inside
{
width: 500px;
}
popularsearches-left
{
float:left;
width:250px;
height:100px;
}
popularsearches-right
{
float:left;
width:250px;
height:100px;
}
here is the jQuery
var closeinterval = 0;
function scrollContent() {
//Toggle left between 250 and 0
var top = jQuery("#popularsearches").scrollLeft() == 0 ? 250 : 0;
jQuery("#popularsearches").animate({ scrollLeft: top }, "slow");
}
// Call scrollContent function every 6 secs
closeinterval = setInterval("scrollContent()", 6000);
jQuery(document).ready(function() {
jQuery("#popular-button-left").bind("click", function() {
if (closeinterval) {
window.clearInterval(closeinterval);
closeinterval = null;
}
jQuery("#popularsearches").animate({ scrollLeft: 0 }, 1000);
});
jQuery("#popular-button-right").bind("click", function() {
if (closeinterval) {
window.clearInterval(closeinterval)
closeinterval = null;
}
jQuery("#popularsearches").animate({ scrollLeft: 250 }, 1000);
});
});
