我正在使用皇家滑块。我将以下代码直接插入到我的网站 HTML 中（注意：url 已被省略）...
<!-- jQuery, 1.7+ is required -->
<script src="url"></script>
<!-- main slider JS, get it from build tool http://dimsemenov.com/private -->
<script src="url"></script>
<!-- main slider style -->
<link href="url">
<!-- selected skin style -->
<link href="url" rel="stylesheet">
`<!-- slider css -->
<style>
/* you may put here additional slider CSS */
/* but it'll be better if you move it to separate CSS file that your site uses */
</style>
并将以下内容放入正文中以进行测试...
<div id="content-slider" class="royalSlider contentSlider rsDefault">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
</div>
<script type="text/javascript">// <![CDATA[
// Slider initialization, you may put this part of code in JS file
jQuery(document).ready(function($) {
// slider initialization
$('#content-slider').royalSlider({
// example of slider options
controlNavigation: 'bullets',
autoPlay: {
enabled: true
},
deeplinking: {
enabled: true,
prefix: 'slider-'
}
});
});
// ]]></script>
看起来幻灯片根本没有加载。任何建议或帮助将不胜感激！
更新：
我输入了以下内容：
<div id="content-slider" class="royalSlider contentSlider rsDefault">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
</div>
<head>
// All your <head> content goes here
<script type="text/javascript">
$(document).ready(function(){
// slider initialization
$('#content-slider').royalSlider({
// example of slider options
controlNavigation: 'bullets',
autoPlay: {
enabled: true
},
deeplinking: {
enabled: true,
prefix: 'slider-'
}
});
});
</script>
</head>
并将代码更新为以下...
<div id="content-slider" class="royalSlider contentSlider rsDefault">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
</div>
<p>// All yourcontent goes here</p>
<script type="text/javascript">// <![CDATA[
$(document).ready(function(){
// slider initialization
$('#content-slider').royalSlider({
// example of slider options
controlNavigation: 'bullets',
autoPlay: {
enabled: true
},
deeplinking: {
enabled: true,
prefix: 'slider-'
}
});
});
// ]]></script>