1、调用CSS样式:
<link rel="stylesheet" href="css/style.css" type="text/css" charset="utf-8" />
<link rel="stylesheet" href="css/fractionslider.css">
2、调用JS插件代码:
<script src="js/jquery-1.9.0.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.fractionslider.js" type="text/javascript" charset="utf-8"></script>
3、添加HTML代码:
将<!--效果html开始-->......<!--效果html结束-->之间的html和js代码;放在<body></body>之间。
4、初始化代码:
<script language="javascript">
$(window).load(function(){
$('.slider').fractionSlider({
'fullWidth': true,
'controls': true,
'pager': true,
'responsive': true,
'dimensions': "1000,400",
'increase': false,
'pauseOnHover': true
});
});
</script>