我试图在我的页面中使用jQuery使用这个垂直滚动news ticker插件。我已经在我的页面中完成了这个
在我的html页面
<div id="newsticker-container">
<ul>
<li>
<div>1) Facebook type vertical navigation menu</div>
</li>
<li>
<div>2) Facebook type vertical navigation menu</div>
</li>
<li>
<div>3) Facebook type vertical navigation menu</div>
</li>
<li>
<div>4) Facebook type vertical navigation menu</div>
</li>
<li>
<div>5) Facebook type vertical navigation menu</div>
</li>
<li>
<div>5) Facebook type vertical navigation menu</div>
</li>
<li>
<div>6) Facebook type vertical navigation menu</div>
</li>
<li>
<div>7) Facebook type vertical navigation menu</div>
</li>
</ul>
</div>
在头部我jave包含了Javascript
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/newsticker.js"></script>
<script type="text/javascript">
$(function(){
$('#newsticker-container').newsTicker();
});
</script>
在css部分,我已经完成了
#newsticker-container a{color: #D83B97;text-decoration: none;}
#newsticker-container
{
width: 200px;
margin: auto;
margin-top: 30px;
border: 5px solid #eeeeee;
background-color: red;
}
#newsticker-container ul li div
{
border-top: 1px solid #e2e2e2;
background: #ffffff;
padding: 10px 5px;
}
然而,css似乎存在一些问题。看看它:
这里的错误是什么?
答案 0 :(得分:0)
请插入此代码
<link rel="stylesheet" type="text/css" href="index.css" media="all">
之后
<script type="text/javascript" src="newsticker.js"></script>
没有:
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="newsticker.js"></script>
<script type="text/javascript">
$(function(){
$('#newsticker-container').newsTicker();
});
</script>
<style>
body, html { padding: 0px; margin: 0px; }
body { background: none repeat scroll 0% 0% rgb(204, 204, 204); }
#newsticker-container a { color: rgb(216, 59, 151); text-decoration: none; }
#newsticker-container { width: 400px; margin: 30px auto auto; border: 5px solid rgb(238, 238, 238); }
#newsticker-container ul li div { border-top: 1px solid rgb(226, 226, 226); background: none repeat scroll 0% 0% rgb(255, 255, 255); padding: 10px 5px; }
</style>
<div id="newsticker-container">
<ul>
<li>
<div>1) Facebook type vertical navigation menu</div>
</li>
<li>
<div>2) Facebook type vertical navigation menu</div>
</li>
<li>
<div>3) Facebook type vertical navigation menu</div>
</li>
<li>
<div>4) Facebook type vertical navigation menu</div>
</li>
<li>
<div>5) Facebook type vertical navigation menu</div>
</li>
<li>
<div>5) Facebook type vertical navigation menu</div>
</li>
<li>
<div>6) Facebook type vertical navigation menu</div>
</li>
<li>
<div>7) Facebook type vertical navigation menu</div>
</li>
</ul>
</div>