Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- Copy To the Header:
- <!-- get jQuery from the google apis -->
- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.js"></script>
- <!-- CSS STYLE-->
- <link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
- <!-- SLIDER REVOLUTION 4.x SCRIPTS -->
- <script type="text/javascript" src="rs-plugin/js/jquery.themepunch.plugins.min.js"></script>
- <script type="text/javascript" src="rs-plugin/js/jquery.themepunch.revolution.min.js"></script>
- <!-- SLIDER REVOLUTION 4.x CSS SETTINGS -->
- <link rel="stylesheet" type="text/css" href="rs-plugin/css/settings.css" media="screen" />
- Create in the Document some Slider Markups like here:
- <!--
- #################################
- - THEMEPUNCH BANNER -
- #################################
- -->
- <div class="tp-banner-container">
- <div class="tp-banner" >
- <ul>
- <!-- SLIDE -->
- <li data-transition="fade" data-slotamount="7" data-masterspeed="1500" >
- <!-- MAIN IMAGE -->
- <img src="images/slidebg1.jpg" alt="slidebg1" data-bgfit="cover" ata-bgposition="left top" data-bgrepeat="no-repeat">
- <!-- LAYERS -->
- <!-- LAYER NR. 1 -->
- <div class="tp-caption lightgrey_divider skewfromrightshort fadeout"
- data-x="85"
- data-y="224"
- data-speed="500"
- data-start="1200"
- data-easing="Power4.easeOut">My Caption
- </div>
- ...
- </li>
- <!-- SLIDE -->
- <li data-transition="zoomout" data-slotamount="7" data-masterspeed="1000" >
- <!-- MAIN IMAGE -->
- <img src="images/darkblurbg.jpg" alt="darkblurbg" data-bgfit="cover" data-bgposition="left top" data-bgrepeat="no-repeat">
- <!-- LAYERS -->
- <!-- LAYER NR. 1 -->
- <div class="tp-caption lightgrey_divider skewfromrightshort fadeout"
- data-x="85"
- data-y="224"
- data-speed="500"
- data-start="1200"
- data-easing="Power4.easeOut">My Caption
- </div>
- ...
- </li>
- ....
- </ul>
- </div>
- </div>
- Initialise the Plugin somewhere in the Body Footer:
- <script type="text/javascript">
- jQuery(document).ready(function() {
- jQuery('.tp-banner').revolution(
- {
- delay:9000,
- startwidth:1170,
- startheight:500,
- hideThumbs:10
- });
- });
- </script>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement