묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
슬라이드 jquery 샘플 이용방법 좀 봐 주세요
2016.03.09 11:04
아래는 샘플인데 스크립트가 그대로 보여지는데
이거 안나타나게 하면 그대로 이용할 수가 있을 것 같은대
안보이게 하는 방법을 모르겠습니다.
<!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">
<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'>
<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">
<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>
<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">
<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 -->
<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 -->
<!-- End outer wrapper -->
<script class="secret-source">
jQuery(document).ready(function($) {
jQuery(document).ready(function($) {
$('#banner-fade').bjqs({
height : 320,
width : 620,
responsive : true
});
height : 320,
width : 620,
responsive : true
});
});
</script>
</script>
<h2>Slide Example</h2>
<!-- Outer wrapper for presentation only, this can be anything you like -->
<div id="banner-slide">
<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 -->
<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>
<!-- 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>
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($) {
jQuery(function($) {
$('.secret-source').secretSource({
includeTag: false
});
includeTag: false
});
});
</script>
</script>
</body>
</html>
</html>
댓글 2
-
Julian-Choi
2016.03.09 17:53
-
김동하123
2016.03.11 15:22
<script class="secret-source">
jQuery(document).ready(function($) {$('#banner-fade').bjqs({
height : 320,
width : 620,
responsive : true
});});
샘플사이트에서 받은 것을 적용려고 보니설명하기 위해서 보여주는 위의 스크립트가 그대로 실행시 브리우저에서 보여지고 있는데이를 삭제하면 슬라이드가 안됩니다.위 스크립트 안나타나게 하려면 어떻게 하나요?
스크립트가 그대로 보여진다고 하시는데 소스보기 또는 웹브라우저의 개발자툴에서 보여지는 소스를 말씀하시는건가요.
우선 기본적인 사항부터 말씀드리면 스크립트나 css 등은 원천적으로 막는 것이 어렵 or 불가합니다.
후킹이라는 개념을 이용하면 왠만한 소스는 다 뚫리기 마련입니다.
단, include 시키는 script나 css파일들을 압축형태로 이용을 하게되면 여러가지 이점을 볼수 있고 또한 보여진다하더라도
분석하기 어려움이 있지요.
답변이 되었을지 모르겠네요.