묻고답하기

  2. Support
  3. 묻고답하기

슬라이드 jquery 샘플 이용방법 좀 봐 주세요

2016.03.09 11:04

김동하123

 
아래는 샘플인데 스크립트가 그대로 보여지는데
이거 안나타나게 하면 그대로 이용할 수가 있을 것 같은대
안보이게 하는 방법을 모르겠습니다.
 
 
 
 
<!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 -->
     
    </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>
이 게시물을
좋아요
목록
태그 쓰기