1
我已將jquery幻燈片放入我新創建的房地產網站。 我的房地產網站運行在'Openrealty'平臺上，它是php。爲什麼jQuery幻燈片不能正常顯示？
這是我的原始jQuery代碼的一部分。
if(!repeat)
$this.parent()
.find('li:nth-child('+current+') a')
.stop(true,true)
.animate({'marginRight':'-20px'},300,function(){
$(this).animate({'opacity':'0.7'},700);
});
當我通過'Firebug'查看錯誤來自哪裏時，它顯示如下。
if(!repeat)
$this.parent()
.find('li:nth-child('+current+') a')
.stop(true,true)
.animate(,300,function(){
$(this).animate(,700);
});
在這裏您可以清楚地看到原始代碼的某些部分不會被瀏覽器渲染。如
{'marginRight':'-20px'}
如圖所示由螢火蟲錯誤從開始「.animate（300，函數（）{」開始，我需要找到一個解決方案，爲什麼這個jQuery不是在我的網站作品。
來源的這個jQuery幻燈片：http://tympanus.net/codrops/2010/04/28/pretty-simple-content-slider-with-jquery-and-css3/
任何反饋是非常歡迎...
謝謝你的第一個2個回答，並要求 是我刪除了所有（'）標記根據答案，在所有樣式中。 但仍然錯誤發生如上所述...
共JQuery腳本有三個部分。 1.鏈接到http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js 2.鏈接到外部JS文件名爲 'jquery.easing.1.3.js' 3.內嵌腳本 以下是內嵌的jQuery：
<script type="text/javascript">
$(function() {
var current = 1;
var iterate = function(){
var i = parseInt(current+1);
var lis = $('#rotmenu').children('li').size();
if(i>lis) i = 1;
display($('#rotmenu li:nth-child('+i+')'));
}
display($('#rotmenu li:first'));
var slidetime = setInterval(iterate,3000);
$('#rotmenu li').bind('click',function(e){
clearTimeout(slidetime);
display($(this));
e.preventDefault();
});
function display(elem){
var $this = elem;
var repeat = false;
if(current == parseInt($this.index() + 1))
repeat = true;
/* slide in the current one */
if(!repeat)
$this.parent()
.find('li:nth-child('+current+') a')
.stop(true,true)
.animate({marginRight:-20px},300,function(){
$(this).animate({opacity:0.7},700);
});
current = parseInt($this.index() + 1);
var elem = $('a',$this);
elem.stop(true,true).animate({marginRight:0px,opacity:1.0},300);
var info_elem = elem.next();
$('#rot1 .heading').animate({left:-420px}, 500,'easeOutCirc',function(){
$('h1',$(this)).html(info_elem.find('.info_heading').html());
$(this).animate({left:0px},400,'easeInOutQuad');
});
$('#rot1 .description').animate({bottom:-270px},500,'easeOutCirc',function(){
$('p',$(this)).html(info_elem.find('.info_description').html());
$(this).animate({bottom:0px},400,'easeInOutQuad');
})
$('#rot1').prepend(
$('<img/>',{
style : 'opacity:0',
className : 'bg'
}).load(
function(){
$(this).animate({opacity:1},600);
$('#rot1 img:first').next().animate({opacity:0},700,function(){
$(this).remove();
});
}
).attr('src','slide-images/'+info_elem.find('.info_image').html()).attr('width','950').attr('height','300')
);
}
});
</script>
而且下面是HTML一部分顯示幻燈片放映。
<div id="sliderbox">
<div class="rotator">
<ul id="rotmenu">
<li>
<a href="rot1">Luxury Life</a>
<div style="display:none;">
<div class="info_image">1.jpg</div>
<div class="info_heading">Best Homes for you</div>
<div class="info_description">
This is description...
<a href="#" class="more">Read more</a>
</div>
</div>
</li>
<li>
<a href="rot2">Smiling Faces</a>
<div style="display:none;">
<div class="info_image">2.jpg</div>
<div class="info_heading">Do at our best</div>
<div class="info_description">
This is description...
<a href="#" class="more">Read more</a>
</div>
</div>
</li>
<li>
<a href="rot3">Tradition</a>
<div style="display:none;">
<div class="info_image">3.jpg</div>
<div class="info_heading">We goes with tradition</div>
<div class="info_description">
This is description...
<a href="#" class="more">Read more</a>
</div>
</div>
</li>
<li>
<a href="rot4">Lands for sale</a>
<div style="display:none;">
<div class="info_image">4.jpg</div>
<div class="info_heading">A best place to live in Kandy</div>
<div class="info_description">
This is description...
<a href="#" class="more">Read more</a>
</div>
</div>
</li>
<li>
<a href="rot5">True Nature</a>
<div style="display:none;">
<div class="info_image">5.jpg</div>
<div class="info_heading">Brings you beauty in nature</div>
<div class="info_description">
This is description...
<a href="#" class="more">Read more</a>
</div>
</div>
</li>
</ul>
<div id="rot1">
<img src="" width="950" height="300" class="bg" alt=""/>
<div class="heading">
<h1></h1>
</div>
<div class="description">
<p></p>
</div>
</div>
</div>
</div>
和下面是CSS：
.rotator{
background-color:#222;
width:950px;
height:300px;
margin:0px auto;
position:relative;
/*font-family:'Myriad Pro',Arial,Helvetica,sans-serif;*/
font-family:Helvetica,sans-serif;
color:#fff;
text-transform:uppercase;
/* letter-spacing:-1px; */
letter-spacing:1px;
border:3px solid #f0f0f0;
overflow:hidden;
-moz-box-shadow:0px 0px 10px #222;
-webkit-box-shadow:0px 0px 10px #222;
box-shadow:0px 0px 10px #222;
}
img.bg{
position:absolute;
top:0px;
left:0px;
}
.rotator ul{
list-style:none;
position:absolute;
right:0px;
top:0px;
margin-top:6px;
z-index:999999;
}
.rotator ul li{
display:block;
float:left;
clear:both;
width:260px;
}
.rotator ul li a{
width:230px;
float:right;
clear:both;
padding-left:10px;
text-decoration:none;
display:block;
height:30px;
line-height:30px;
background-color:#222;
margin:1px -20px 1px 0px;
/*opacity:0.7;*/
color:#f0f0f0;
font-size:12px;
border:1px solid #000;
border-right:none;
outline:none;
/*
text-shadow:-1px 1px 1px #000;
*/
-moz-border-radius:10px 0px 0px 5px;
-webkit-border-top-left-radius:10px;
-webkit-border-bottom-left-radius:10px;
border-top-left-radius:10px;
border-bottom-left-radius:10px;
}
/* .rotator ul li a:hover{
text-shadow:0px 0px 2px #fff;
}
*/
.rotator .heading{
position:absolute;
top:0px;
left:0px;
width:500px;
}
.rotator .heading h1{
text-shadow:-1px 1px 1px #555;
font-weight:normal;
font-size:36px;
padding:20px;
}
.rotator .description{
width:300px;
height:15px;
position:absolute;
bottom:0px;
left:0px;
padding:5px;
background-color:#222;
-moz-border-radius:0px 10px 0px 0px;
-webkit-border-top-right-radius:10px;
border-top-right-radius:10px;
/*opacity:0.7;*/
border-top:1px solid #000;
border-right:1px solid #000;
}
.rotator .description p{
/*text-shadow:-1px 1px 1px #000;*/
text-transform:none;
letter-spacing:normal;
line-height:10px;
font-family:Helvetica,sans-serif;
font-size:13px;
}
a.more{
color:orange;
text-decoration:none;
text-transform:uppercase;
font-size:10px;
}
a.more:hover{
color:#fff;
}
我分析每一個這些腳本，但未能發現任何問題...... 請告訴我怎樣才能解決這個問題。
你能展示一些你更多的 '原始PHP代碼'？它看起來很像JavaScript代碼，而不是我。你如何輸出這段代碼到文檔中？我們能看到他們周圍的線條嗎？ – Konerak
是的我已經修復了更多細節問題，請回頭看看.. Tnx .. – herath