我无法让jQuery与IE7一起工作。我正在使用jQuery Cycle插件,但我相信这个问题与jQuery有关(事实上我是一个新手)。我正在尝试使用横幅旋转器,它适用于Firefox,Safari和IE8。在IE7上,它甚至没有激活......它只是一个接一个地显示每个div。
提前谢谢!
实施例 http://testing.observerpapers.com/lv
JS
$(document).ready(function() {
$('#myslides')
.before('<div id="nav">')
.cycle({
fx: 'fade', // choose your transition type
speedIn: 600,
speedOut: 600,
timeout: 8000,
pause: 0, // so that pauses when user hovers over a slide
pager: '#nav', // instructs the plugin to create navigation elements
}); // every child element of the container becomes a slide
/*ddsmoothmenu.init({
mainmenuid: "smoothmenu1", //menu DIV id
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu', //class added to menu's outer DIV
//customtheme: ["#1c5a80", "#18374a"],
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
});*/
});
CSS
#myslides {
width: 980px;
height: 360px;
/*overflow: hidden;*/
z-index: 500;
background:none !important;
}
#myslides div {
/*background:none !important;*/
}
#myslides .textBlock {
background: url(../images/home/bg-bb-textblocks.png) top left repeat;
width: 360px;
padding: 4px;
margin-top: 42px;
margin-left: 33px;
}
#myslides .textBlock div {
padding: 17px 8px 10px 18px;
border: 1px solid #756e67;
}
#myslides h1 {
font: normal 24px/1.2 Helvetica, Arial, sans-serif;
text-transform: uppercase;
color: #fff;
margin-bottom: 5px;
}
#myslides p {
font: normal 14px/1.3 Helvetica, Arial, sans-serif;
color: #fff;
}
#myslides cite {
display: block;
width: 500px;
font-style: normal;
text-transform: uppercase;
color: #fff;
font-size: 12px;
position: absolute;
bottom: 6px;
left: 20px;
z-index: 5000;
}
#myslides > div {
width: 980px;
height: 386px;
}
#myslides .billBoard1 {
background: url(../images/home/bb-kingston.jpg) top left repeat;
}
#myslides .billBoard2 {
background: url(../images/home/bb-harbor-breeze.jpg) top left repeat;
}
#myslides .billBoard3 {
background: url(../images/home/bb-mondrian.jpg) top left repeat;
}
.slides {
margin-left: 385px;
width: 539px;
}
.navBG {
position: absolute;
display: block;
z-index: 500;
bottom: 0;
width: 980px;
height: 30px;
background: url(../images/home/bg-bb-textblocks.png) top left repeat;
}
#nav {
position: absolute;
z-index: 501;
top: 356px;
right: 10px;
height: 30px;
text-align: right;
}
#nav a:hover, #nav a.activeSlide {
background:none repeat scroll 0 0;
font-weight: bold;
color: #fff;
}
#nav a {
background:url("") repeat-x scroll 0 0;
color: #d6d2cf;
display: inline-block;
font: 12px/18px Helvetica, Arial, san-serif;
height: 18px;
margin: 4px 0 0 5px;
padding: 2px 8px;
text-align: center;
text-decoration: none;
}
#nav {
font-size: 23px;
}
答案 0 :(得分:10)
删除循环属性中的最后一个逗号。 IE不吃那个:
$(document).ready(function() {
$('#myslides')
.before('<div id="nav">')
.cycle({
fx: 'fade', // choose your transition type
speedIn: 600,
speedOut: 600,
timeout: 8000,
pause: 0, // so that pauses when user hovers over a slide
pager: '#nav' //HERE I REMOVED THE COMMA
});