Question

在这个网站：

有一个名为MULTILINES SIMPLE EXAMPLE的例子。我可以让它工作，但没有风格的视觉网站的样式。到目前为止，这是我的工作代码：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://risq.github.io/jquery-advanced-news-ticker/assets/js/jquery.newsTicker.js"></script>
<ul id="nt-example1">
                            <li>Etiam imperdiet volutpat libero eu tristique. Aenean, rutrum felis in. <a href="#">Read more...</a></li>
                            <li>Curabitur porttitor ante eget hendrerit adipiscing. Maecenas at magna. <a href="#">Read more...</a></li>
                            <li>Praesent ornare nisl lorem, ut condimentum lectus gravida ut. <a href="#">Read more...</a></li>
                            <li>Nunc ultrices tortor eu massa placerat posuere. Vivamus viverra sagittis. <a href="#">Read more...</a></li>
                            <li>Morbi sodales tellus sit amet leo congue bibendum. Ut non mauris eu neque. <a href="#">Read more...</a></li>
                            <li>In pharetra suscipit orci sed viverra. Praesent at sollicitudin tortor, id. <a href="#">Read more...</a> </li>
                            <li>Maecenas nec ligula sed est suscipit aliquet sed eget ipsum, suspendisse. <a href="#">Read more...</a></li>
                            <li>Onec bibendum consectetur diam, nec euismod urna venenatis eget.. <a href="#">Read more...</a> </li>
                        </ul>
<script>
var nt_example1 = $('#nt-example1').newsTicker({
    row_height: 80,
    max_rows: 3,
    duration: 400,
    prevButton: $('#nt-example1-prev'),
    nextButton: $('#nt-example1-next')
});
</script>

因此，行中的文字是滚动但我没有像示例网站中那样的箭头和线条以及颜色。我看到只是简单的文字向上滚动。

我试图转到演示页面源视图：

view-source:http://risq.github.io/jquery-advanced-news-ticker/

但我没有看到那部分内容在每个示例附近的exmaples演示的网站中，有简单的代码，但没有风格的视觉效果。

Answer 1

他们在main.css中设置了他们的例子，这些例子在页面的标题中调用。

http://risq.github.io/jquery-advanced-news-ticker/assets/css/main.css

相关的样式从第490行开始：

/* nt-example1 */

#nt-example1 {
max-width: 620px;
margin: auto;
}

#nt-example1-container {
text-align: center;
}

#nt-example1-container i {
font-size: 36px;
margin: 8px;
cursor: pointer;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
}

#nt-example1-container i:hover {
color: #333;
}

#nt-example1 li {
color: #4e4e4e;
background: #F2F2F2;
overflow: hidden;
height: 80px;
padding: 10px;
line-height: 30px;
list-style: none;
font-size: 24px;
text-align: left;
border-bottom: 1px dotted #2c8162;
}

#nt-example1 li:hover {
background: #FFF;
}

我如何找到并获取javascript的<style>代码部分？</style>

1 个答案: