با سلام. همون طور که می دونید باید از پیج سورس استفاده کنید.من سورس رو گرفتم و سورس رو در اینجا می زارم:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>jQuery OneByOne Slider Plugin</title>
<script src="js/jquery-1.6.4.min.js"></script>
<script src="js/jquery.onebyone.min.js"></script>
<script src="js/jquery.touchwipe.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#banner').oneByOne({
className: 'oneByOne1',
easeType: 'random',
slideShow: true
});
});
</script>
<link href="css/jquery.onebyone.css" rel="stylesheet" type="text/css">
<link href="css/example1.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="css/animate.css">
<style type="text/css" media="screen">
#wrapper{
width: 100%;
-webkit-user-select: none;
}
#ep1{
position:absolute;
left: 36px;
top: 50px;
}
.otherExample{
position: absolute;
left: 36px;
top: 520px;
}
.otherExample a{
display: block;
float: left;
margin-right: 16px;
color: #0066FF;
}
.otherExample a:hover{
color: #B22222;
text-decoration: underline;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="ep1"><img src="images/assets/example1.gif" alt="example" /></div>
<div id="banner">
<div class="oneByOne_item">
<span class="text1">iOS Friendly</span>
<span class="text2">Drag and throw the banner</span>
<img src="images/example1/books/book1.png" class="img1" />
<img src="images/example1/books/book2.png" class="img2" />
</div>
<div class="oneByOne_item">
<img src="images/example1/books/monitor.png" class="img3" alt=""></img>
<img src="images/example1/books/fsw.png" class="img4" alt=""></img>
<img src="images/example1/books/slider-fsw-logo.png" class="img5" alt=""></img>
<span class="text3">Hello Envato</span>
<span class="text4">The awesome marketplace</span>
</div>
<div class="oneByOne_item slide3">
<img src="images/example1/item1/wordpress-256x256.png" class="wp3" alt=""></img>
<img src="images/example1/item1/wordpress-128x128.png" class="wp2" alt=""></img>
<img src="images/example1/item1/wordpress-64x64.png" class="wp1" alt=""></img>
<span class="txt1"><a href="http://themeforest.net/user/sike">I'm WordPress</a></span>
<span class="txt2">Above is a hyperlink ;)</span>
</div>
<div class="oneByOne_item">
<span class="wp1">Touch Screen</span>
<span class="wp2">Please Wipe Left or Right</span>
<img src="images/example1/item2/wordpress-64x64.png" class="wp1" alt=""></img>
<img src="images/example1/item2/wordpress-128x128.png" class="wp2" alt=""></img>
<img src="images/example1/item2/wordpress-256x256.png" class="wp3" alt=""></img>
</div>
<div class="oneByOne_item">
<img src="images/example1/bigimage.jpg" class="bigImage" ></img>
<span class="slide5Txt1">Support Big Image</span>
<span class="slide5Txt2">Unlimited Text block</span>
</div>
</div>
<div class="otherExample"><a href="example2.html">Example 2</a></div>
</div>
</div>
</body>
</html>
به جای آدرس های عکس آدرس های عکس خود را بگزارید.در غیر این صورت عکس هارا نشان نمی دهد(چون عکس ها وجود ندارند)
سلام
دوست عزیز چطور تونستی این کد را انقدر تمیز از توی page source در بیاری؟
من که page source گرفتم این کد را داد
<!doctype html> <!--[if lt IE 7 ]> <html lang="en" class="ie6 oldie no-js"> <![endif]--> <!--[if IE 7 ]> <html lang="en" class="ie7 oldie no-js"> <![endif]--> <!--[if IE 8 ]> <html lang="en" class="ie8 oldie no-js"> <![endif]--> <!--[if IE 9 ]> <html lang="en" class="ie9 no-js"> <![endif]--> <!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]--> <head> <meta http-equiv="X-UA-Compatible" content="chrome=1"> <title>jQuery OneByOne Slider Plugin Preview - CodeCanyon</title> <meta name="Description" content="<h5><a href="http://3.s3.envato.com/files/7843895/index.html">Click here to..."> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="/stylesheets/compiled/fullscreen_preview.css (http://barnamenevis.org/view-source:http://codecanyon.net/stylesheets/compiled/fullscreen_preview.css)"/> <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/icons/codecanyon.net/apple-touch-icon-144x144-precomposed.png (http://barnamenevis.org/view-source:http://codecanyon.net/icons/codecanyon.net/apple-touch-icon-144x144-precomposed.png)" /> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/icons/codecanyon.net/apple-touch-icon-114x114-precomposed.png (http://barnamenevis.org/view-source:http://codecanyon.net/icons/codecanyon.net/apple-touch-icon-114x114-precomposed.png)" /> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/icons/codecanyon.net/apple-touch-icon-72x72-precomposed.png (http://barnamenevis.org/view-source:http://codecanyon.net/icons/codecanyon.net/apple-touch-icon-72x72-precomposed.png)" /> <link rel="apple-touch-icon-precomposed" href="/icons/codecanyon.net/apple-touch-icon-precomposed.png (http://barnamenevis.org/view-source:http://codecanyon.net/icons/codecanyon.net/apple-touch-icon-precomposed.png)" /> <script src="/javascripts/lib/jquery-1.7.1.min.js (http://barnamenevis.org/view-source:http://codecanyon.net/javascripts/lib/jquery-1.7.1.min.js)"></script> <script> //function to fix height of iframe! var calcHeight = function() { var headerDimensions = $('#header-bar').height(); $('#preview-frame').height($(window).height() - headerDimensions); } $(document).ready(function() { calcHeight(); $('#header-bar a.close').mouseover(function() { $('#header-bar a.close').addClass('activated'); }).mouseout(function() { $('#header-bar a.close').removeClass('activated'); }); }); $(window).resize(function() { calcHeight(); }).load(function() { calcHeight(); }); </script> <!-- JAVASCRIPT FOR AND GOOGLE ANALYTICS --> <script> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-11834194-12']); _gaq.push(['_trackPageLoadTime']); _gaq.push(['_trackPageview']); _gaq.push(['b._setAccount', 'UA-11834194-36']); _gaq.push(['b._trackPageLoadTime']); _gaq.push(['b._trackPageview']); (function() { var ga = document.createElement('script'); ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; ga.setAttribute('async', 'true'); var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> <!-- END JAVASCRIPT --> <meta content="" name="WT.si_n" /> <meta content="" name="WT.si_x" /> <meta content="" name="WT.si_cs" /> <script type="text/javascript">var NREUMQ=NREUMQ||[];NREUMQ.push(["mark","firstbyte",new Date().getTime()]);</script></head> <body> <div id="header-bar"> <div class="close-header"> <a id="close-button" title="Close CodeCanyon Bar" class="close" href="http://1.s3.envato.com/files/7843895/index.html (http://barnamenevis.org/view-source:http://1.s3.envato.com/files/7843895/index.html)">X</a> </div> <p class="meta-data"> <a class="close" href="http://1.s3.envato.com/files/7843895/index.html (http://barnamenevis.org/view-source:http://1.s3.envato.com/files/7843895/index.html)">Remove Frame</a> <a class="purchase" href="/item/jquery-onebyone-slider-plugin/684613 (http://barnamenevis.org/view-source:http://codecanyon.net/item/jquery-onebyone-slider-plugin/684613)" >Purchase this Item!</a> </p> <a class="acodecanyon-preview-logo site-loopback" href="/item/jquery-onebyone-slider-plugin/684613 (http://barnamenevis.org/view-source:http://codecanyon.net/item/jquery-onebyone-slider-plugin/684613)">codecanyon</a><span class="preview">item preview</span> </div> <iframe id="preview-frame" src="http://1.s3.envato.com/files/7843895/index.html (http://barnamenevis.org/view-source:http://1.s3.envato.com/files/7843895/index.html)" name="preview-frame" frameborder="0" noresize="noresize"> </iframe> <script src="/javascripts/webtrends.js (http://barnamenevis.org/view-source:http://codecanyon.net/javascripts/webtrends.js)"></script> <!-- START OF SmartSource Data Collector TAG v10.2.0 --> <!-- Copyright (c) 2012 Webtrends Inc. All rights reserved. --> <script> window.webtrendsAsyncInit=function(){ var dcs=new Webtrends.dcs().init({ dcsid:"dcsu1to8wvz5bd8f6if7d3qse_2j4x" ,domain:"statse.webtrendslive.com" ,timezone:10 ,offsite:true ,download:true ,downloadtypes:"xls,doc,pdf,txt,csv,zip,docx,xlsx,rar,gzip" ,onsitedoms:"codecanyon.net" ,plugins:{ hm:{src:"//s.webtrends.com/js/webtrends.hm.js"} } }).track(); }; (function(){ var s=document.createElement("script"); s.async=true; s.src="/javascripts/webtrends.min.js"; var s2=document.getElementsByTagName("script")[0]; s2.parentNode.insertBefore(s,s2); }()); </script> <noscript><img alt="dcsimg" id="dcsimg" width="1" height="1" src="//statse.webtrendslive.com/dcs4nx9hnvz5bd4wo8cwvxpse_5g4u/njs.gif?dcsuri=/nojavascript&WT.js=No&WT.tv=10.2.0&dcssip=www.3doc ean.net"/></noscript> <!-- END OF SmartSource Data Collector TAG v10.2.0 --> <!--[if lt IE 7]> <script src="/javascripts/lib/DD_belatedPNG.js"></script> <script src="/javascripts/utilities/ie6.js"></script> <![endif]--> <script type="text/javascript">if (!NREUMQ.f) { NREUMQ.f=function() { NREUMQ.push(["load",new Date().getTime()]); var e=document.createElement("script"); e.type="text/javascript";e.async=true;e.src="https://d1ros97qkrwjf5.cloudfront.net/42/eum/rum.js"; document.body.appendChild(e); if(NREUMQ.a)NREUMQ.a(); }; NREUMQ.a=window.onload;window.onload=NREUMQ.f; }; NREUMQ.push(["nrfj","beacon-1.newrelic.com","fcf8d519de",13909,"dA4NFkNbVV1URBcMRVIMTAREWFVuQlVKAFRZPhMQVEJQVEY=",0.0,56,new Date().getTime(),"","","","",""])</script></body> </html>
میشه یکم توضیح بدی تا ما هم بتونیم این کارو انجام بدیم ؟
مرسی