묻고답하기
슬라이딩 이미지 샘플인데 예제 스크립트가 안나오게 좀 부탁합니다
2016.03.23 19:25
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Basic jQuery Slider - Demo</title>
<!-- bjqs.css contains the *essential* css needed for the slider to work -->
<link rel="stylesheet" href="bjqs.css">
<!-- some pretty fonts for this demo page - not required for the slider -->
<link href='http://fonts.googleapis.com/css?family=Source+Code+Pro|Open+Sans:300' rel='stylesheet' type='text/css'>
<!-- demo.css contains additional styles used to set up this demo page - not required for the slider -->
<link rel="stylesheet" href="demo.css">
<!-- load jQuery and the plugin -->
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="js/bjqs-1.3.min.js"></script>
</head>
<body>
<div id="container">
<h2>Fade Example</h2>
<!-- Outer wrapper for presentation only, this can be anything you like -->
<div id="banner-fade">
<!-- start Basic Jquery Slider -->
<ul class="bjqs">
<li><img src="img/banner01.jpg" title="Automatically generated caption"></li>
<li><img src="img/banner02.jpg" title="Automatically generated caption"></li>
<li><img src="img/banner03.jpg" title="Automatically generated caption"></li>
</ul>
<!-- end Basic jQuery Slider -->
</div>
<!-- End outer wrapper -->
<script class="secret-source">
jQuery(document).ready(function($) {
$('#banner-fade').bjqs({
height : 320,
width : 620,
responsive : true
});
});
</script>
<h2>Slide Example</h2>
<!-- Outer wrapper for presentation only, this can be anything you like -->
<div id="banner-slide">
<!-- start Basic Jquery Slider -->
<ul class="bjqs">
<li><a href=""><img src="img/banner01.jpg" title="Automatically generated caption"></a></li>
<li><img src="img/banner02.jpg" title="Automatically generated caption"></li>
<li><img src="img/banner03.jpg" title="Automatically generated caption"></li>
</ul>
<!-- end Basic jQuery Slider -->
</div>
<!-- End outer wrapper -->
<!-- attach the plug-in to the slider parent element and adjust the settings as required -->
<script class="secret-source">
jQuery(document).ready(function($) {
$('#banner-slide').bjqs({
animtype : 'slide',
height : 320,
width : 620,
responsive : true,
randomstart : true
});
});
</script>
</div>
<!--
The following script is not related to basic jQuery Slider
It's used to create the code snippets in the demo.
https://github.com/maelstrom/SecretSource
-->
<script src="js/libs/jquery.secret-source.min.js"></script>
<script>
jQuery(function($) {
$('.secret-source').secretSource({
includeTag: false
});
});
</script>
</body>
</html>
빨간 글자를 샘플로 보여주는데
삭제하면 슬라이딩이 되지를 않습니다.
첨부파일을 참조로 해주세요