init commit2
This commit is contained in:
zino
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 104 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 390 B |
Binary file not shown.
|
After Width: | Height: | Size: 8.7 KiB |
@@ -0,0 +1,356 @@
|
||||
/*!
|
||||
* Documenter 1.6
|
||||
* http://rxa.li/documenter
|
||||
*
|
||||
* Copyright 2011, Xaver Birsak
|
||||
* http://revaxarts.com
|
||||
*
|
||||
*/
|
||||
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{
|
||||
margin:0;
|
||||
padding:0;
|
||||
border:0;
|
||||
outline:0;
|
||||
font-weight:inherit;
|
||||
font-style:inherit;
|
||||
font-size:100%;
|
||||
font-family:inherit;
|
||||
vertical-align:baseline;
|
||||
}
|
||||
html {
|
||||
font-size:101%;
|
||||
font-family:Arial,verdana,arial,sans-serif;
|
||||
font-size:12px;
|
||||
-webkit-text-size-adjust:none;
|
||||
color:#6F6F6F;
|
||||
background-color:#efefef;
|
||||
}
|
||||
body{
|
||||
min-height:100%;
|
||||
height:auto;
|
||||
width:100%;
|
||||
}
|
||||
footer, header, section {
|
||||
display:block;
|
||||
}
|
||||
a{ color:#6F6F6F; text-decoration:none; cursor:pointer; }
|
||||
a:hover { text-decoration:underline }
|
||||
p, ul, ol{
|
||||
margin:18px 0;
|
||||
line-height:1.5em;
|
||||
}
|
||||
li{
|
||||
list-style:none;
|
||||
}
|
||||
li.placeholder{
|
||||
height:70px;
|
||||
width:100%;
|
||||
font-size:16px;
|
||||
}
|
||||
hr {
|
||||
display:block;
|
||||
height:0px;
|
||||
line-height:0px;
|
||||
border:0;
|
||||
border-top:1px solid #ddd;
|
||||
border-bottom:1px solid #aaa;
|
||||
margin:16px 0;
|
||||
padding:0;
|
||||
}
|
||||
hr.notop{
|
||||
margin-top:0;
|
||||
}
|
||||
strong{
|
||||
font-weight:700;
|
||||
}
|
||||
#documenter_content{
|
||||
position:absolute;
|
||||
right:18px;
|
||||
left:218px;
|
||||
padding-left:10px;
|
||||
padding-bottom:800px;
|
||||
min-height:100%;
|
||||
height:auto;
|
||||
z-index:1;
|
||||
}
|
||||
#documenter_sidebar{
|
||||
-moz-box-shadow:0 0 6px rgba(3,3,3,0.6);
|
||||
-webkit-box-shadow:0 0 6px rgba(3,3,3,0.6);
|
||||
box-shadow:0 0 6px rgba(3,3,3,0.6);
|
||||
position:fixed;
|
||||
left:0;
|
||||
width:200px;
|
||||
height:100%;
|
||||
min-height:100%;
|
||||
z-index:100;
|
||||
}
|
||||
#documenter_sidebar a{
|
||||
position:relative;
|
||||
z-index:100;
|
||||
}
|
||||
img{
|
||||
border:0;
|
||||
}
|
||||
#documenter_copyright{
|
||||
position:absolute;
|
||||
bottom:10px;
|
||||
font-size:10px;
|
||||
right:15px;
|
||||
width:200px;
|
||||
text-align:right;
|
||||
z-index:1
|
||||
}
|
||||
noscript{
|
||||
display:block;
|
||||
position:absolute;
|
||||
top:238px;
|
||||
margin:0 auto;
|
||||
width:800px;
|
||||
bottom:0;
|
||||
z-index:20;
|
||||
}
|
||||
noscript p{
|
||||
width:800px;
|
||||
font-size:20px;
|
||||
padding-top:20px;
|
||||
margin:0 auto;
|
||||
color:#4D4D4D;
|
||||
}
|
||||
.small{
|
||||
font-size:10px;
|
||||
letter-spacing:0;
|
||||
}
|
||||
|
||||
/*----------------------------------------------------------------------*/
|
||||
/* Sidebar
|
||||
/*----------------------------------------------------------------------*/
|
||||
|
||||
#documenter_sidebar #documenter_logo{
|
||||
display:block;
|
||||
height:20%;
|
||||
max-height:200px;
|
||||
min-height:70px;
|
||||
width:200px;
|
||||
background-position:center center;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
#documenter_sidebar ol{
|
||||
font-size:12px;
|
||||
font-weight:700;
|
||||
min-height:150px;
|
||||
height:75%;
|
||||
overflow:auto;
|
||||
}
|
||||
|
||||
#documenter_sidebar ol li{
|
||||
text-align:right;
|
||||
padding:0;
|
||||
}
|
||||
#documenter_sidebar ol a{
|
||||
display:block;
|
||||
border-top:1px solid #ddd;
|
||||
border-bottom:1px solid #aaa;
|
||||
padding:6px 15px 7px 0;
|
||||
text-align:right;
|
||||
}
|
||||
#documenter_sidebar ol a:hover,#documenter_sidebar ol a.current{
|
||||
-webkit-text-shadow:none;
|
||||
-moz-text-shadow:none;
|
||||
text-shadow:none;
|
||||
text-decoration:none;
|
||||
}
|
||||
#documenter_sidebar ol li ol{
|
||||
border-top:0;
|
||||
font-size:10px;
|
||||
min-height:10px;
|
||||
height:auto;
|
||||
overflow:auto;
|
||||
margin:0;
|
||||
display:none;
|
||||
}
|
||||
#documenter_sidebar ol li ol li a{
|
||||
display:block;
|
||||
padding:4px 15px 5px 0;
|
||||
text-align:right;
|
||||
}
|
||||
|
||||
/*----------------------------------------------------------------------*/
|
||||
/* Content
|
||||
/*----------------------------------------------------------------------*/
|
||||
|
||||
#documenter_cover{
|
||||
height:800px;
|
||||
padding-top:200px !important;
|
||||
}
|
||||
#documenter_cover li{
|
||||
list-style:none !important;
|
||||
margin-left:0 !important;
|
||||
}
|
||||
#documenter_cover p{
|
||||
width:500px;
|
||||
}
|
||||
#documenter_content section{
|
||||
padding-top:70px;
|
||||
}
|
||||
#documenter_content h1{
|
||||
font-size:30px;
|
||||
font-weight:700;
|
||||
}
|
||||
#documenter_content h2{
|
||||
font-size:20px;
|
||||
margin-bottom:18px;
|
||||
font-weight:100;
|
||||
}
|
||||
#documenter_content h3{
|
||||
font-size:26px;
|
||||
margin:18px 0 0;
|
||||
font-weight:100;
|
||||
}
|
||||
#documenter_content h4{
|
||||
font-size:20px;
|
||||
margin:18px 0;
|
||||
font-weight:100;
|
||||
}
|
||||
#documenter_content h5{
|
||||
font-size:16px;
|
||||
margin:18px 0;
|
||||
font-weight:100;
|
||||
}
|
||||
#documenter_content h6{
|
||||
font-size:14px;
|
||||
margin:18px 0;
|
||||
font-weight:100;
|
||||
}
|
||||
#documenter_content p{
|
||||
margin:18px 0;
|
||||
}
|
||||
#documenter_content ol li{
|
||||
list-style:decimal;
|
||||
margin-left:36px;
|
||||
}
|
||||
#documenter_content ul li{
|
||||
list-style:square;
|
||||
margin-left:36px;
|
||||
}
|
||||
#documenter_content dl{
|
||||
}
|
||||
#documenter_content dl dt{
|
||||
padding-top:12px;
|
||||
font-weight:700;
|
||||
font-size:14px;
|
||||
}
|
||||
#documenter_content dl dd{
|
||||
padding-top:3px;
|
||||
margin-left:18px;
|
||||
}
|
||||
#documenter_content table{
|
||||
border-collapse:collapse;
|
||||
}
|
||||
#documenter_content table th{
|
||||
font-weight:700;
|
||||
}
|
||||
#documenter_content table th, #documenter_content table td{
|
||||
padding:3px;
|
||||
text-align:left;
|
||||
}
|
||||
#documenter_content code, #documenter_content pre{
|
||||
font-family:"Courier New", Courier, monospace;
|
||||
font-size:12px;
|
||||
}
|
||||
#documenter_content .warning{
|
||||
padding:10px 10px 10px 30px;
|
||||
border:1px solid #D5D458;
|
||||
background-color:#F0FEB1;
|
||||
background-image:url(img/warning.png);
|
||||
background-repeat:no-repeat;
|
||||
background-position: 8px 11px;
|
||||
}
|
||||
#documenter_content .info{
|
||||
padding:10px 10px 10px 30px;
|
||||
border:1px solid #6AB3FF;
|
||||
background-color:#A3D0FF;
|
||||
background-image:url(img/info.png);
|
||||
background-repeat:no-repeat;
|
||||
background-position: 8px 11px;
|
||||
}
|
||||
#documenter_content pre{
|
||||
background-image:url(img/pre_bg.png);
|
||||
line-height:19px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/*----------------------------------------------------------------------*/
|
||||
/* Print Styles
|
||||
/*----------------------------------------------------------------------*/
|
||||
|
||||
@media print {
|
||||
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
|
||||
-ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */
|
||||
a, a:visited { color: #444 !important; text-decoration: underline; }
|
||||
a[href]:after { content: " (" attr(href) ")"; }
|
||||
abbr[title]:after { content: " (" attr(title) ")"; }
|
||||
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
|
||||
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
|
||||
thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */
|
||||
tr, img { page-break-inside: avoid; }
|
||||
@page { margin: 0.5cm; }
|
||||
p, h2, h3 { orphans: 3; widows: 3; }
|
||||
h2, h3{ page-break-after: avoid; }
|
||||
hr { border-top:1px solid #000 !important;border-bottom:0 !important; }
|
||||
|
||||
#documenter_sidebar{
|
||||
-moz-box-shadow:none;
|
||||
-webkit-box-shadow:none;
|
||||
box-shadow:none;
|
||||
position:absolute;
|
||||
left:10px;
|
||||
top:0;
|
||||
width:100%;
|
||||
margin-top:500px;
|
||||
}
|
||||
#documenter_sidebar ol:before { content: "Table of Contents"; }
|
||||
|
||||
#documenter_sidebar ol{
|
||||
border:0 !important;
|
||||
}
|
||||
#documenter_sidebar ol li{
|
||||
border:0 !important;
|
||||
text-align:left;
|
||||
}
|
||||
#documenter_sidebar ol li a{
|
||||
border:0 !important;
|
||||
text-align:left;
|
||||
padding:4px;
|
||||
}
|
||||
#documenter_sidebar ol li a:hover{
|
||||
border:0 !important;
|
||||
}
|
||||
#documenter_sidebar #documenter_logo{
|
||||
display:none;
|
||||
}
|
||||
#documenter_sidebar #documenter_copyright{
|
||||
display:none;
|
||||
}
|
||||
#documenter_content{
|
||||
left:10px;
|
||||
}
|
||||
#documenter_cover{
|
||||
margin-bottom:300px;
|
||||
}
|
||||
#documenter_content .warning{
|
||||
background-image:url(img/warning.png) !important;
|
||||
background-repeat:no-repeat !important;
|
||||
background-position: 8px 11px !important;
|
||||
}
|
||||
#documenter_content .info{
|
||||
background-image:url(img/info.png) !important;
|
||||
background-repeat:no-repeat !important;
|
||||
background-position: 8px 11px !important;
|
||||
}
|
||||
#documenter_content pre{
|
||||
background-image:url(img/pre_bg.png) !important;
|
||||
line-height:19px;
|
||||
}
|
||||
}
|
||||
BIN
website/Boson/Revolution Slider Documentation/css/img/info.png
Normal file
BIN
website/Boson/Revolution Slider Documentation/css/img/info.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 686 B |
BIN
website/Boson/Revolution Slider Documentation/css/img/pre_bg.png
Normal file
BIN
website/Boson/Revolution Slider Documentation/css/img/pre_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 98 B |
Binary file not shown.
|
After Width: | Height: | Size: 607 B |
@@ -0,0 +1,10 @@
|
||||
/*
|
||||
* Copyright (c) 2012
|
||||
* -------------------------------
|
||||
* powered by revaxarts.com (http://revaxarts.com)
|
||||
* original filename: shDocumenter.css
|
||||
* filesize: 3735 Bytes
|
||||
* last modified: Tue, 05 Apr 2011 16:10:24 +0200
|
||||
*
|
||||
*/
|
||||
.syntaxhighlighter { background-color: #FEFEFE !important; margin:9px 0 !important; } .syntaxhighlighter .line.alt1 { background-color: #F0F0F0 !important; } .syntaxhighlighter .line.alt2 { background-color: #FEFEFE !important; } .syntaxhighlighter .line.highlighted.alt1, .syntaxhighlighter .line.highlighted.alt2 { background-color: #c3defe !important; } .syntaxhighlighter .line.highlighted.number { color: #FEFEFE !important; } .syntaxhighlighter { overflow:auto !important; } .syntaxhighlighter table { min-width:900px !important; width:100% !important; } .syntaxhighlighter table caption { color: black !important; } .syntaxhighlighter .gutter { color: #787878 !important; width:3% !important; text-align:right; } .syntaxhighlighter .code { width:97% !important; } .syntaxhighlighter .code .line { overflow:hidden; height:18px !important; } .syntaxhighlighter .gutter .line { overflow:hidden; border-right: 3px solid #FEFEFE !important; height:18px !important; } .syntaxhighlighter .gutter .line.highlighted { background-color: #FEFEFE !important; color: #787878 !important; } .syntaxhighlighter.printing .line .content { border: none !important; } .syntaxhighlighter.collapsed { overflow: visible !important; } .syntaxhighlighter.collapsed .toolbar { color: #3f5fbf !important; background: #FEFEFE !important; border: 1px solid #d4d0c8 !important; } .syntaxhighlighter.collapsed .toolbar a { color: #3f5fbf !important; } .syntaxhighlighter.collapsed .toolbar a:hover { color: #aa7700 !important; } .syntaxhighlighter .toolbar { color: #a0a0a0 !important; background: #d4d0c8 !important; border: none !important; } .syntaxhighlighter .toolbar a { color: #a0a0a0 !important; } .syntaxhighlighter .toolbar a:hover { color: red !important; } .syntaxhighlighter .plain, .syntaxhighlighter .plain a { color: black !important; } .syntaxhighlighter .comments, .syntaxhighlighter .comments a { color: #3f5fbf !important; } .syntaxhighlighter .string, .syntaxhighlighter .string a { color: #2a00ff !important; } .syntaxhighlighter .keyword { color: #7f0055 !important; } .syntaxhighlighter .preprocessor { color: #646464 !important; } .syntaxhighlighter .variable { color: #aa7700 !important; } .syntaxhighlighter .value { color: #009900 !important; } .syntaxhighlighter .functions { color: #ff1493 !important; } .syntaxhighlighter .constants { color: #0066cc !important; } .syntaxhighlighter .script { font-weight: bold !important; color: #7f0055 !important; background-color: none !important; } .syntaxhighlighter .color1, .syntaxhighlighter .color1 a { color: gray !important; } .syntaxhighlighter .color2, .syntaxhighlighter .color2 a { color: #ff1493 !important; } .syntaxhighlighter .color3, .syntaxhighlighter .color3 a { color: red !important; } .syntaxhighlighter .keyword { font-weight: bold !important; } .syntaxhighlighter .xml .keyword { color: #3f7f7f !important; font-weight: normal !important; } .syntaxhighlighter .xml .color1, .syntaxhighlighter .xml .color1 a { color: #7f007f !important; } .syntaxhighlighter .xml .string { font-style: italic !important; color: #2a00ff !important; }
|
||||
953
website/Boson/Revolution Slider Documentation/documentation.html
Normal file
953
website/Boson/Revolution Slider Documentation/documentation.html
Normal file
@@ -0,0 +1,953 @@
|
||||
<!doctype html>
|
||||
<!--[if IE 6 ]><html lang="en-us" class="ie6"> <![endif]-->
|
||||
<!--[if IE 7 ]><html lang="en-us" class="ie7"> <![endif]-->
|
||||
<!--[if IE 8 ]><html lang="en-us" class="ie8"> <![endif]-->
|
||||
<!--[if (gt IE 7)|!(IE)]><!-->
|
||||
<html lang="en-us"><!--<![endif]-->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>Revolution Responsive jQuery Slider - The Documentation</title>
|
||||
|
||||
<meta name="description" content="For support please checkout http://themepunch.ticksy.com !">
|
||||
<meta name="author" content="ThemePunch">
|
||||
<meta name="copyright" content="ThemePunch">
|
||||
<meta name="generator" content="Documenter v1.6 http://rxa.li/documenter">
|
||||
<meta name="date" content="2012-06-28T00:00:00+02:00">
|
||||
|
||||
<link rel="stylesheet" href="css/documenter_style.css" media="all">
|
||||
|
||||
|
||||
<script src="js/jquery.1.6.4.js"></script>
|
||||
|
||||
<script src="js/jquery.scrollTo-1.4.2-min.js"></script>
|
||||
<script src="js/jquery.easing.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="css/shDocumenter.css" media="screen">
|
||||
<script src="js/shCore.js"></script>
|
||||
<script src="js/shBrushCss.js"></script>
|
||||
<script src="js/shBrushXml.js"></script>
|
||||
<script src="js/shBrushJScript.js"></script>
|
||||
<script>SyntaxHighlighter.defaults['toolbar'] = false;SyntaxHighlighter.all();</script>
|
||||
|
||||
<script>document.createElement('section');var duration=913,easing='easeOutQuart';</script>
|
||||
<script src="js/script.js"></script>
|
||||
|
||||
<style>
|
||||
html{background-color:#A8A7A7;color:#363636;background-image:url(assets/images/image_2.gif);background-repeat:repeat;background-attachment:scroll;}
|
||||
::-moz-selection{background:#404040;color:#B50D0D;}
|
||||
::selection{background:#404040;color:#B50D0D;}
|
||||
#documenter_sidebar #documenter_logo{background-image:url(assets/images/image_3.png);}
|
||||
a{color:#830909;}
|
||||
hr{border-top:1px solid #858484;border-bottom:1px solid #CFCDCD;}
|
||||
#documenter_sidebar, #documenter_sidebar ol a{background-color:#363636;color:#A8A7A7;}
|
||||
#documenter_sidebar ol a{-webkit-text-shadow:1px 1px 0px #575757;-moz-text-shadow:1px 1px 0px #575757;text-shadow:1px 1px 0px #575757;}
|
||||
#documenter_sidebar ol{border-top:1px solid #242424;}
|
||||
#documenter_sidebar ol a{border-top:1px solid #575757;border-bottom:1px solid #242424;color:#A8A7A7;}
|
||||
#documenter_sidebar ol a:hover{background:#404040;color:#B50D0D;border-top:1px solid #404040;}
|
||||
#documenter_sidebar ol a.current{background:#404040;color:#B50D0D;border-top:1px solid #404040;}
|
||||
#documenter_copyright{display:block !important;visibility:visible !important;}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="documenter_sidebar">
|
||||
<a href="#documenter_cover" id="documenter_logo"></a>
|
||||
<ol id="documenter_nav">
|
||||
<li><a class="current" href="#documenter_cover">Start</a></li>
|
||||
<li><a href="#install">Install</a></li>
|
||||
<li><a href="#markup">Markup</a></li>
|
||||
<li><a href="#layout">Layout</a></li>
|
||||
<li><a href="#responsive_basic">Responsive Basic</a></li>
|
||||
<li><a href="#fullwidth">Fullwidth</a></li>
|
||||
<li><a href="#publicapi">Public Api</a></li>
|
||||
<li><a href="#licenses">Licenses</a></li>
|
||||
<li><a href="#support">Support</a></li>
|
||||
|
||||
</ol>
|
||||
<div id="documenter_copyright">Copyright ThemePunch 2012<br>
|
||||
made with the <a href="http://rxa.li/documenter">Documenter v1.6</a>
|
||||
</div>
|
||||
</div>
|
||||
<div id="documenter_content">
|
||||
<section id="documenter_cover"><h1>Revolution Responsive jQuery Slider</h1><h2>The Documentation</h2><hr><ul><li>Created: 06/22/2012</li><li>latest Update: 05/11/2012</li><li>By: ThemePunch</li><li><a href="http://www.codecanyon.com/user/themepunch?ref=themepunch">www.codecanyon.com/user/themepunch</a></li><li>Email: <a href="mailto:info@themepunch.com">info@themepunch.com</a></li></ul><p>For support please checkout http://themepunch.ticksy.com !</p></section><section id="install">
|
||||
<h3>Install</h3><hr class="notop">
|
||||
<p>
|
||||
This chapter will gives you general instructions on how to install the slider and setup the options. Later chapters will be more detailed if needed.</p>
|
||||
<p>
|
||||
</p>
|
||||
<h4>
|
||||
00 What files do I need to upload to my server?</h4>
|
||||
<p>
|
||||
Please upload the rs-plugin folder to your server. In this folder you will find the following subfolders containing all of the items content:</p>
|
||||
<ul>
|
||||
<li>
|
||||
js</li>
|
||||
<li>
|
||||
css</li>
|
||||
<li>
|
||||
assets</li>
|
||||
</ul>
|
||||
<p>
|
||||
You could use your own jQuery but we recommend loading it directly from the Google ressources (see later in this documentation).</p>
|
||||
<p>
|
||||
You will find an <strong>example</strong> <strong>index.html and index-fullwidth.html</strong> in your downloaded zip. </p>
|
||||
<h4>
|
||||
01 Implement the jQuery</h4>
|
||||
<p>
|
||||
Add the following lines to your HTML Head: </p>
|
||||
<pre class="brush: js">
|
||||
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js></pre>
|
||||
<p>
|
||||
</p>
|
||||
<h3>
|
||||
</h3>
|
||||
<h4>
|
||||
02 Add Revolution js and css files to your HTML page</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
Also in the <HEAD> section:</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<pre class="brush: html">
|
||||
<!-- jQuery REVOLUTION Slider -->
|
||||
<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>
|
||||
|
||||
<!-- REVOLUTION BANNER CSS SETTINGS -->
|
||||
<link rel="stylesheet" type="text/css" href="rs-plugin/css/settings.css" media="screen" />
|
||||
</pre>
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
This contains the JS and CSS for the Slider itself and some helping modules .</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<h4>
|
||||
03 A Create the surrounding DIV for your Slider (Responsive, none Full Width)</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
Put it in the HTML:</div>
|
||||
<div>
|
||||
</div>
|
||||
<pre class="brush: html">
|
||||
<div class="banner-container">
|
||||
|
||||
<div class="banner">...</div>
|
||||
|
||||
</div>
|
||||
</pre>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<h4>
|
||||
03 B Create the surrounding DIV for your Slider (Responsive, Full Width Slider)</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
Put it in the HTML:</div>
|
||||
<div>
|
||||
</div>
|
||||
<pre class="brush: html">
|
||||
<div class="fullwidthbanner-container">
|
||||
|
||||
<div class="fullwidthbanner">...</div>
|
||||
|
||||
</div>
|
||||
|
||||
</pre>
|
||||
<div>
|
||||
</div>
|
||||
<h4>
|
||||
</h4>
|
||||
</div>
|
||||
<div>
|
||||
<h4>
|
||||
04 Put an unordered list inside to hold the different slides as list elements</h4>
|
||||
<p>
|
||||
</p>
|
||||
<pre class="brush: html">
|
||||
<ul>
|
||||
<!-- THE BOXSLIDE EFFECT EXAMPLES WITH LINK ON THE MAIN SLIDE EXAMPLE -->
|
||||
|
||||
<li data-transition="boxslide" data-slotamount="7" data-link="http://www.google.de">
|
||||
<img src="images/slides/image1.jpg">
|
||||
<div class="caption sft big_white" data-x="400" data-y="100" data-speed="700" data-start="1700" data-easing="easeOutBack">KICKSTART YOUR WEBSITE</div>
|
||||
<div class="caption sfb big_orange" data-x="400" data-y="142" data-speed="500" data-start="1900" data-easing="easeOutBack">WITH SLIDER REVOLUTION!</div>
|
||||
<div class="caption lfr medium_grey" data-x="510" data-y="210" data-speed="300" data-start="2000">UNLIMITED TRANSITIONS</div>
|
||||
</li>
|
||||
...
|
||||
</ul></pre>
|
||||
<div>
|
||||
</div>
|
||||
<h4>
|
||||
05 Call the jQuery Plugin to build the Slider</h4>
|
||||
<p>
|
||||
</p>
|
||||
<pre class="brush: js">
|
||||
<script type="text/javascript">
|
||||
var tpj=jQuery; // MAKE JQUERY PLUGIN CONFLICTFREE
|
||||
tpj.noConflict();
|
||||
|
||||
tpj(document).ready(function() {
|
||||
|
||||
if (tpj.fn.cssOriginal!=undefined) // CHECK IF fn.css already extended
|
||||
tpj.fn.css = tpj.fn.cssOriginal;
|
||||
|
||||
tpj('.banner').revolution(
|
||||
{
|
||||
delay:9000,
|
||||
startheight:490,
|
||||
startwidth:890,
|
||||
|
||||
hideThumbs:200,
|
||||
|
||||
thumbWidth:100,
|
||||
thumbHeight:50,
|
||||
thumbAmount:5,
|
||||
|
||||
navigationType:"bullet",
|
||||
navigationArrows:"nexttobullets",
|
||||
navigationStyle:"round",
|
||||
|
||||
navigationHAlign:"center",
|
||||
navigationVAlign:"bottom",
|
||||
navigationHOffset:0,
|
||||
navigationVOffset:20,
|
||||
|
||||
soloArrowLeftHalign:"left",
|
||||
soloArrowLeftValign:"center",
|
||||
soloArrowLeftHOffset:20,
|
||||
soloArrowLeftVOffset:0,
|
||||
|
||||
soloArrowRightHalign:"right",
|
||||
soloArrowRightValign:"center",
|
||||
soloArrowRightHOffset:20,
|
||||
soloArrowRightVOffset:0,
|
||||
touchenabled:"on",
|
||||
onHoverStop:"on",
|
||||
|
||||
navOffsetHorizontal:0,
|
||||
navOffsetVertical:20,
|
||||
|
||||
hideCaptionAtLimit:0,
|
||||
hideAllCaptionAtLilmit:0,
|
||||
hideSliderAtLimit:0,
|
||||
|
||||
stopAtSlide:-1,
|
||||
stopAfterLoops:-1,
|
||||
|
||||
shadow:1,
|
||||
fullWidth:"off"
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
</p>
|
||||
</section>
|
||||
<section id="markup">
|
||||
<h3>Markup</h3><hr class="notop">
|
||||
<p> The items markup uses javascript/jQuery to transform a block of HTML markup into the slider, all customization is done trough the use of HTML5 data attributes and CSS. The markup is valid for HTML5 rules and the content will be fully indexed by search engines. The general structure of markup follows this schema:</p>
|
||||
<p> </p>
|
||||
<h4>
|
||||
01 Two surrounding DIVs are the basic holder for your Slider:</h4>
|
||||
<div>
|
||||
Put it in the HTML for Responsive but none <strong>FullWidth</strong> version:</div>
|
||||
<div>
|
||||
</div>
|
||||
<pre class="brush: html">
|
||||
<div id="banner_container">
|
||||
<div id="banner" >...</div>
|
||||
</div>
|
||||
</pre>
|
||||
<div>
|
||||
<div>
|
||||
Put it in the HTML for <strong>Responsive</strong> version:</div>
|
||||
<div>
|
||||
</div>
|
||||
<pre class="brush: html">
|
||||
<div id="fullwidthbanner-container">
|
||||
<div id="fullwidthbanner" >...</div>
|
||||
</div>
|
||||
|
||||
</pre>
|
||||
<div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
The outside container could be used by one of your divs in your page and is needed for the responsive part.<br>
|
||||
To get more know about the fullwidth and/or responsive containers, see our style.css examples.</div>
|
||||
<div>
|
||||
</div>
|
||||
<h4>
|
||||
02 An unordered list inside holds the different slides as list elements</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<pre class="brush: html">
|
||||
<ul>
|
||||
<!-- THE BOXSLIDE EFFECT EXAMPLES WITH LINK ON THE MAIN SLIDE EXAMPLE -->
|
||||
|
||||
<li data-transition="flyin" data-slotamount="5" data-thumb="images/thumbs/regular_thumb1.jpg">
|
||||
<img src="images/slides/newslide1.jpg">
|
||||
|
||||
<div class="caption randomrotate fadeout medium_grey"
|
||||
data-x="40" data-y="20"
|
||||
data-speed="900" data-start="1900" data-easing="easeOutBack"
|
||||
data-linktoslide="4">jump slide 4</div>
|
||||
|
||||
<div class="caption randomrotate fadeout medium_grey"
|
||||
data-x="40" data-y="50"
|
||||
data-speed="900" data-start="2100" data-easing="easeOutBack"
|
||||
data-linktoslide="prev">prev slide</div>
|
||||
|
||||
<div class="caption randomrotate fadeout medium_grey"
|
||||
data-x="40" data-y="80"
|
||||
data-speed="900" data-start="2100" data-easing="easeOutBack"
|
||||
data-linktoslide="next">next slide</div>
|
||||
|
||||
<div class="caption lfr randomrotateout big_white"
|
||||
data-x="400" data-y="80"
|
||||
data-speed="900" data-start="1700" data-easing="easeOutBack"
|
||||
data-end="3300" data-endspeed="1000" data-endeasing="easeInOutBack"
|
||||
data-linktoslide="4">Kickstart Your Website</div>
|
||||
|
||||
<div class="caption lfb big_orange"
|
||||
data-x="400" data-y="80"
|
||||
data-speed="1500" data-start="3000" data-easing="easeOutBack">
|
||||
Some Caption Here</div>
|
||||
|
||||
</li>
|
||||
...
|
||||
</ul></pre>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
The next chapter describes the inner of this list elements.</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
The more advanced users will have no problems in customizing the slider up to every detail and create their own sliders with using the CSS files.</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
The CSS file responsible for the layout of your slider is the settings.css. Find All Responsive Settings and Docu later in "Responsive Captions".</div>
|
||||
</section>
|
||||
<section id="layout">
|
||||
<h3>Layout</h3><hr class="notop">
|
||||
<h4>
|
||||
01 The Default parameters of the Plugin</h4>
|
||||
<div>
|
||||
<ul>
|
||||
<li>
|
||||
<strong>delay</strong> The time one slide stays on the screen in Milliseconds (Default: 9000)</li>
|
||||
<li>
|
||||
<strong>startheight </strong>Basic Height of the Slider in the desktop resolution in pixel, other screen sizes will be calculated from this (Default: 490) It should be similiar to the settings of the style sheet. If you use a fullwidth banner, ti will deinfe the max. Height of the banner by resizing of the browser. The banner wont ne heigher than this value.</li>
|
||||
<li>
|
||||
<strong>startwidth </strong>Basic Width of the Slider in the desktop resolution in pixel, other screen sizes will be calculated from this (Default: 890) It should be similiar to the settings of the style sheet. If you use a fullwidth banner, ti will deinfe the max. Width of the banner by resizing of the browser.</li>
|
||||
<li>
|
||||
<strong>hideThumbs </strong>Time after that the Thumbs will be hidden(Default: 200),</li>
|
||||
<li>
|
||||
<strong>navigationType</strong> Display type of the navigation bar (Default:"none")<br>
|
||||
Options:<br>
|
||||
bullet<br>
|
||||
thumb ** In Fullwidth version thumbs wont be displayed if navigation offset set to shwop thumbs outside of the container ! Thumbs must be showen in the container!<br>
|
||||
none</li>
|
||||
<li>
|
||||
<strong>navigationArrows</strong> Display position of the Navigation Arrows (Default: "nexttobullets")<br>
|
||||
Options:<br>
|
||||
nexttobullets<br>
|
||||
verticalcentered changed to <strong>solo</strong> ** By navigation Type Thumb arrows position can be set via further options below<br>
|
||||
none</li>
|
||||
<li>
|
||||
<strong>navigationStyle</strong> Look of the navigation bullets (Default: "round")<br>
|
||||
Options:<br>
|
||||
round<br>
|
||||
navbar<br>
|
||||
round-old<br>
|
||||
square-old<br>
|
||||
navbar-old ** If you choose navbar-old, we recommend to choose Navigation Arrows to nexttobullets</li>
|
||||
<li>
|
||||
<strong>navigationHAlign</strong> options: left,center,right - Horizontal Align of Bullets / Thumbnails</li>
|
||||
<li>
|
||||
<strong>navigationVAlign</strong> options: top,center,bottom - Vertical Align of Bullets / Thumbnails</li>
|
||||
<li>
|
||||
<strong>navigationHOffset</strong> a value between -600 to 600 - Offset from current Horizontal position of Bullets / Thumbnails negative and positive direction</li>
|
||||
<li>
|
||||
<strong>navigationVOffset</strong> a value between -600 to 600 - Offset from current Vertical position of Bullets / Thumbnails negative and positive direction</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>soloArrowLeftHalign</strong> options: left,center,right - Horizontal Align of left Arrow (only if arrow is not next to bullets)</li>
|
||||
<li>
|
||||
<strong>soloArrowLeftValign</strong> options: top,center,bottom - Vertical Align of left Arrow (only if arrow is not next to bullets)</li>
|
||||
<li>
|
||||
<strong>soloArrowLeftHOffset</strong> a value between -600 to 600 - Offset from current Horizontal position of of left Arrow negative and positive direction</li>
|
||||
<li>
|
||||
<strong>soloArrowLeftVOffset</strong> a value between -600 to 600 - Offset from current Vertical position of of left Arrow negative and positive direction</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>soloArrowRightHalign</strong> left,center,right - Horizontal Align of right Arrow (only if arrow is not next to bullets)</li>
|
||||
<li>
|
||||
<strong>soloArrowRightValign</strong> top,center,bottom - Vertical Align of right Arrow (only if arrow is not next to bullets)</li>
|
||||
<li>
|
||||
<strong>soloArrowRightHOffset</strong> a value between -600 to 600 - Offset from current Horizontal position of right Arrow negative and positive direction</li>
|
||||
<li>
|
||||
<strong>soloArrowRightVOffset</strong> a value between -600 to 600 - Offset from current Vertical position of right Arrow negative and positive direction</li>
|
||||
<li>
|
||||
<strong>navOffsetHorizontal </strong>The Bar is centered but could be moved this pixel count left(e.g. -10) or right (Default:<strong> </strong>0) ** By resizing the banner, it will be always centered !!</li>
|
||||
<li>
|
||||
<strong>navOffsetVertical</strong> The Bar is bound to the bottom but could be moved this pixel count up (e. g. -20) or down (Default: 20)</li>
|
||||
<br>
|
||||
<li><strong>touchenabled</strong> Enable Swipe Function on touch devices (Default: "on")<br>
|
||||
Options:<br>
|
||||
on<br>
|
||||
off</li>
|
||||
<li>
|
||||
<strong>shadow</strong> The Shadow display underneath the banner<br>
|
||||
Options:<br>
|
||||
0 No Shadow<br>
|
||||
1<br>
|
||||
2<br>
|
||||
3</li>
|
||||
<li>
|
||||
<strong>onHoverStop</strong> Stop the Timer when hovering the slider<br>
|
||||
Options:<br>
|
||||
on<br>
|
||||
off</li>
|
||||
<li>
|
||||
<strong>thumbWidth</strong> the basic Width of one Thumbnail (only if thumb is selected. Default:100)</li>
|
||||
<li>
|
||||
<strong>thumbHeight</strong> the basic Height of one Thumbnail (only if thumb is selected Default 50)</li>
|
||||
<li>
|
||||
<strong>thumbAmount</strong> the amount of the Thumbs visible same time (only if thumb is selected)<br>
|
||||
** All Thumbs will be hidden in smallest Responsive Level, and in smaller level default size is reseted to 60x30px. Can be modificated in the settings.css file)</li>
|
||||
<li>
|
||||
<strong>hideCaptionAtLimit</strong> It Defines if a caption should be shown under a Width Limit ( Basod on The Width of Banner ! ) You need to define the captions which should be shown seperately with data-captionhidden="on/off" </li>
|
||||
<li>
|
||||
<strong>hideAllCaptionAtLilmit</strong> Hide all The Captions if Width of Browser is less then this value</li>
|
||||
<li>
|
||||
<strong>hideSliderAtLimit</strong> under this Limit the Slider is hidden and the timer is stopped</li>
|
||||
<li>
|
||||
<strong>fullWidth</strong> on/off It turns on the Horizontal Centering of Images in FullWidth version. In Case the Image is bigger then the container width, it fits the image with its height in the container and centers horizontally.</li>
|
||||
<li>
|
||||
<strong>stopAtSlide</strong> -1 or 1 to 999. Stop at selected Slide Number. If set to -1 it will loop without stopping. Only available if stopAfterLoops is not equal -1 !</li>
|
||||
<li>
|
||||
<strong>stopAfterLoops</strong> -1 or 0 to 999. Stop at selected Slide Number (stopAtSlide) after slide looped "x" time, where x this Number. If set to -1 it will loop without stopping. Only available if stopAtSlide not equal -1 ! </li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<h4>
|
||||
02 Slider items</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<strong><li></strong> - Every list item represents a new banner/slider item.</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
Transition effects and a possible slide link are defined here:</div>
|
||||
<ul>
|
||||
<li>
|
||||
<strong>data-transition </strong>The appearance transition of this slide<br>
|
||||
Options: <br>
|
||||
boxslide<br>
|
||||
boxfade<br>
|
||||
slotzoom-horizontal<br>
|
||||
slotslide-horizontal<br>
|
||||
slotfade-horizontal<br>
|
||||
slotzoom-vertical<br>
|
||||
slotslide-vertical<br>
|
||||
slotfade-vertical<br>
|
||||
curtain-1<br>
|
||||
curtain-2<br>
|
||||
curtain-3<br>
|
||||
slideleft<br>
|
||||
slideright<br>
|
||||
slideup<br>
|
||||
slidedown<br>
|
||||
fade<br>
|
||||
random<br>
|
||||
slidehorizontal<br>
|
||||
slidevertical<br>
|
||||
papercut<br>
|
||||
flyin<br>
|
||||
turnoff<br>
|
||||
cube<br>
|
||||
3dcurtain-vertical<br>
|
||||
3dcurtain-horizontal<br>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<strong>data-masterspeed</strong> Set the Speed of the Slide Transition. Default 300, min:100 max:2000.</li>
|
||||
|
||||
<li>
|
||||
<strong>data-slotamount</strong> The number of slots or boxes the slide is divided into. If you use boxfade, over 7 slots can be juggy.</li>
|
||||
<li>
|
||||
<strong>data-link</strong> A link on the whole slide pic</li>
|
||||
<li>
|
||||
<strong>data-target</strong> A link target (like _self or _blank)</li>
|
||||
<li>
|
||||
<strong>data-linktoslide</strong> If data-link="slide" is set, you can define a slide where to jump in case the image has been clicked.</li>
|
||||
<li>
|
||||
<strong>data-delay</strong> A new Dealy value for the Slide. If no delay defined per slide, the dealy defined via Options will be used</li>
|
||||
<li>
|
||||
<strong>data-thumb</strong> An Alternative Source for thumbs. If not defined a copy of the background image will be used in resized form</li>
|
||||
<li>
|
||||
<strong>data-fstransition</strong> An Alternaive First Slide Transition (only in the first loop, than data-transition will be used)</li>
|
||||
<li>
|
||||
<strong>data-fsmasterspeed</strong> An Alternaive First Slide Transition Speed (only in the first loop, than data-masterspeed will be used)</li>
|
||||
<li>
|
||||
<strong>data-fsslotamount</strong> An Alternaive First Slide Slout Amoun (only in the first loop, than data-slotamoun will be used)</li>
|
||||
|
||||
|
||||
</ul>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
Each List item must include:</div>
|
||||
<ul>
|
||||
<li>
|
||||
an image <img> as Background Image / Main Image with Data of the thumb<br>
|
||||
OR</li>
|
||||
<li>
|
||||
a colored background image AND a coloredbg caption which is full width/height defined !!<br>
|
||||
<div>
|
||||
<pre class="brush: html">
|
||||
<img src="images/slides/coloredbg.png" data-fullwidthcentering="off">
|
||||
<div class="caption coloredbg fade" data-x="0" data-y="0" data-speed="10" data-start="0" style="background-color:#ff9118; width:100%;height:100%"></div>
|
||||
|
||||
</pre>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<p>
|
||||
Each List item can include:</p>
|
||||
<ul>
|
||||
<li>
|
||||
some <div>s containing captions (class="caption"), this could contain embedded video iframes also</li>
|
||||
</ul>
|
||||
<div>
|
||||
<pre class="brush: html">
|
||||
<li data-transition="boxslide" data-slotamount="7" data-link="http://www.google.de">
|
||||
<img src="images/slides/image1.jpg" data-fullwidthcentering="off">
|
||||
<div class="caption sft big_white" data-x="400" data-y="100" data-speed="700" data-start="1700" data-easing="easeOutBack">KICKSTART YOUR WEBSITE</div>
|
||||
<div class="caption sfb big_orange" data-x="400" data-y="142" data-speed="500" data-start="1900" data-easing="easeOutBack">WITH SLIDER REVOLUTION!</div>
|
||||
<div class="caption lfr medium_grey" data-x="510" data-y="210" data-speed="300" data-start="2000">UNLIMITED TRANSITIONS</div>
|
||||
</li>
|
||||
</pre>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<h4>
|
||||
Fulwidth Image Vertical Centering</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
Basically Fullwidth Slider will Align main images to the top and centering horizontally. If Vertically Centering is requested, use the <strong>data-fullwidthcentering</strong> per <img> Possible valuse are <strong>"on"</strong> or <strong>"off"</strong></div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
<h4>
|
||||
03 Captions</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
Captions are Containers which can be customized via CSS, classes for the start animation and some data options.</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
The CSS for the caption added in the settings.css file because it depends strongly on the responsive Sizing. </div>
|
||||
<div>
|
||||
There are 4 Steps of Responsive Contents which are written later below under the Responsive Dependencies Caption.</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
You find an example in the settings.css of our item download.</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
The options are in detail:</div>
|
||||
<ul>
|
||||
<li>
|
||||
color <strong>class</strong> example big_white, big_orange, medium_grey (check the settings.css of the example for details)</li>
|
||||
<br>
|
||||
<li>
|
||||
Class for<strong> Incoming Animations</strong><br>
|
||||
Options:<br>
|
||||
sft - Short from Top<br>
|
||||
sfb - Short from Bottom<br>
|
||||
sfr - Short from Right<br>
|
||||
sfl - Short from Left<br>
|
||||
lft - Long from Top<br>
|
||||
lfb - Long from Bottom<br>
|
||||
lfr - Long from Right<br>
|
||||
lfl - Long from Left<br>
|
||||
fade - fading<br>
|
||||
randomrotate- Fade in, Rotate from a Random position and Degree<br>
|
||||
</li>
|
||||
<br>
|
||||
<li>
|
||||
Class for <strong>Outgoing Animations</strong> (only during the Slide).<br>This is Optional. If not set, but endtime is set via data-end than the same animation type will be used as for incoming animation.<br>
|
||||
Options:<br>
|
||||
stt - Short to Top<br>
|
||||
stb - Short to Bottom<br>
|
||||
str - Short to Right<br>
|
||||
stl - Short to Left<br>
|
||||
ltt - Long to Top<br>
|
||||
ltb - Long to Bottom<br>
|
||||
ltr - Long to Right<br>
|
||||
ltl - Long to Left<br>
|
||||
fadeout - fading<br>
|
||||
randomrotateout- Fade in, Rotate from a Random position and Degree<br>
|
||||
</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>data-x The </strong>horizontal position in the standard (via startwidth option defined) screen size (other screen sizes will be calculated)</li>
|
||||
<li>
|
||||
<strong>data-y </strong>vertical position in the standard (via startheight option defined) screen size (other screen sizes will be calculated)</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>data-speed </strong>duration of the animation in milliseconds</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>data-start after </strong>how many milliseconds should this caption start to show</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>data-easing </strong>special easing effect of the animation. Options:<br>
|
||||
easeOutBack,
|
||||
easeInQuad,
|
||||
easeOutQuad,
|
||||
easeInOutQuad,
|
||||
easeInCubic,
|
||||
easeOutCubic<br>
|
||||
easeInOutCubic,
|
||||
easeInQuart,
|
||||
easeOutQuart,
|
||||
easeInOutQuart,
|
||||
easeInQuint<br>
|
||||
easeOutQuint,
|
||||
easeInOutQuint,
|
||||
easeInSine,
|
||||
easeOutSine,
|
||||
easeInOutSine<br>
|
||||
easeInExpo,
|
||||
easeOutExpo,
|
||||
easeInOutExpo,
|
||||
easeInCirc,
|
||||
easeOutCirc,
|
||||
easeInOutCirc<br>
|
||||
easeInElastic,
|
||||
easeOutElastic,
|
||||
easeInOutElastic,
|
||||
easeInBack,
|
||||
easeOutBack,
|
||||
easeInOutBack<br>
|
||||
easeInBounce,
|
||||
easeOutBounce,
|
||||
easeInOutBounce
|
||||
|
||||
</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>data-endspeed </strong>duration of the animation when caption leaves the stage in milliseconds</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>data-end </strong>after how many milliseconds should this caption leave the stage (should be bigger than data-start+data-speed !</li>
|
||||
<br>
|
||||
<li>
|
||||
<strong>data-endeasing </strong>special easing effect of the animation. Options:<br>
|
||||
easeOutBack,
|
||||
easeInQuad,
|
||||
easeOutQuad,
|
||||
easeInOutQuad,
|
||||
easeInCubic,
|
||||
easeOutCubic<br>
|
||||
easeInOutCubic,
|
||||
easeInQuart,
|
||||
easeOutQuart,
|
||||
easeInOutQuart,
|
||||
easeInQuint<br>
|
||||
easeOutQuint,
|
||||
easeInOutQuint,
|
||||
easeInSine,
|
||||
easeOutSine,
|
||||
easeInOutSine<br>
|
||||
easeInExpo,
|
||||
easeOutExpo,
|
||||
easeInOutExpo,
|
||||
easeInCirc,
|
||||
easeOutCirc,
|
||||
easeInOutCirc<br>
|
||||
easeInElastic,
|
||||
easeOutElastic,
|
||||
easeInOutElastic,
|
||||
easeInBack,
|
||||
easeOutBack,
|
||||
easeInOutBack<br>
|
||||
easeInBounce,
|
||||
easeOutBounce,
|
||||
easeInOutBounce
|
||||
<br>
|
||||
<br>
|
||||
</li>
|
||||
</ul>
|
||||
<div>
|
||||
<img alt="" src="assets/images/image_1.jpg"></div>
|
||||
<div>
|
||||
</div>
|
||||
<h4>
|
||||
<br>
|
||||
04 Colored Backgoround instead of Images</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
In order you wish to use a colored Background instead of some images as main Image in the Slider you can use the transparent image with a colored background style:</div>
|
||||
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<pre><img alt="" src="images/slides/transparent.png" style="background-color:#ff0000"></pre>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
|
||||
<h4>
|
||||
<br>
|
||||
05 Videos</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
In order to embed videos in the slider you can embed videos via iframe of your favorite video site that allows this kind of embedding. An example with Vimeo:</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<pre class="brush: html">
|
||||
<li data-transition="slideup" data-slotamount="20">
|
||||
<img src="images/slides/image20.jpg" >
|
||||
<div class="caption lfb boxshadow" data-x="70" data-y="120" data-speed="900"
|
||||
data-start="500" data-easing="easeOutBack">
|
||||
<iframe src="http://player.vimeo.com/video/29298709?title=0&amp;byline=0&amp;portrait=0" width="460"
|
||||
height="259"></iframe>
|
||||
</div>
|
||||
</li></pre>
|
||||
</div>
|
||||
<br>
|
||||
<h5>Full Screen Video</h5>
|
||||
<p>
|
||||
In order to play FullWidth Videos, use the class "fade fullscreenvideo" in the caption where you embeded the iFrame. Use data-x="0" and data-y="0" and data-speed="500" and data-start="10" for best effect. The Width and height of the iFrame should be 100% !</p>
|
||||
<p>
|
||||
In case you wish to use autoplay, just use the data-autplay="true" parameter in the div where you embeded the iFrame.</p>
|
||||
<p>
|
||||
<pre class="brush: html">
|
||||
<li data-transition="slideup" data-slotamount="20">
|
||||
<img src="images/slides/image20.jpg" >
|
||||
<div class="caption fade fullscreenvideo" data-x="0" data-y="0"
|
||||
data-speed="500" data-start="10" data-easing="easeOutBack">
|
||||
<iframe src="http://player.vimeo.com/video/29298709?title=0&amp;byline=0&amp;portrait=0" width="100%"
|
||||
height="100%"></iframe>
|
||||
</div>
|
||||
</li></pre>
|
||||
</p>
|
||||
<h4>
|
||||
<br>
|
||||
06 Banner Timer</h4>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
In order to use a banner timer, you will need to add the markup within the banner or fullwidthbanner divs.</div>
|
||||
<div>
|
||||
The markup should look like :</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="tp-bannertimer"></div><span class="Apple-tab-span" style="white-space:pre"> </span></div>
|
||||
<div>
|
||||
The use the Timer on the bottom just add the tp-bottom class to the timer like this :</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="tp-bannertimer tp-bottom"></div><span class="Apple-tab-span" style="white-space:pre"> </span></div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
To remove this timer just simple remove the markup from the container, and that is it.</div>
|
||||
</section>
|
||||
<section id="responsive_basic">
|
||||
<h3>Responsive Basic</h3><hr class="notop">
|
||||
<p>
|
||||
Responsive means that the slider will adjust to every screen width.</p>
|
||||
<div>
|
||||
To achieve that you have to set a bunch of mediaqueries that will adjust the whole slider when a certain window size is used, or you will need to use our fullwidth style version, to let the banner always resize itself.</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
The basic containers are build like this ( in none Fullwidth, but 4 Level Responsive Version):</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
<pre class="brush: css">
|
||||
.bannercontainer {
|
||||
padding:5px;
|
||||
background-color:#fff;
|
||||
width:890px;
|
||||
position:relative;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
}
|
||||
|
||||
.banner{
|
||||
width:890px; // MUST BE THE SAME AS IN THE OPTIONS <strong>startwidth</strong>
|
||||
height:490px; // MUST BE THE SAME AS IN THE OPTIONS <strong>startheight</strong>
|
||||
position:relative;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</pre>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
</div>
|
||||
<div>
|
||||
The media queries that build the screen dependend container sizes:</div>
|
||||
<div>
|
||||
</div>
|
||||
<pre class="brush: css">
|
||||
@media only screen and (min-width: 768px) and (max-width: 959px) {
|
||||
.banner, .bannercontainer{ width:750px; height:412px;}
|
||||
.bannershadow {width:750px;}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 480px) and (max-width: 767px) {
|
||||
.banner, .bannercontainer{width:470px; height:258px;}
|
||||
.bannershadow {width:470px;}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 0px) and (max-width: 479px) {
|
||||
.banner, .bannercontainer{width:300px;height:165px;}
|
||||
.bannershadow {width:300px; margin-top:-5px;}
|
||||
}</pre>
|
||||
<br>
|
||||
<h4>Calculate the Resopnsive sizes</h4>
|
||||
<p>Here we can give you a short calculating example. The Width of the Responsive container depending on you in the different browser views. the height can be calculated via a simple example:<p>
|
||||
<p> <strong>new width / original width * original height. </strong> So in our Examplce (step 1.) 750 / 890 * 490 == 413px
|
||||
</div>
|
||||
|
||||
</section>
|
||||
<section id="fullwidth">
|
||||
<h3>Fullwidth</h3><hr class="notop">
|
||||
<p>
|
||||
This slider can go fullwidth too. We have added an <strong>index-fullwidth.html example</strong> for you in the zip.</p>
|
||||
<p>
|
||||
Please note the basic change in the markup.</p>
|
||||
<p>
|
||||
The surrounding containers are:</p>
|
||||
<pre class="brush: html">
|
||||
<div class="fullwidthbanner-container"><span class="Apple-tab-span" style="white-space:pre"> </span>
|
||||
|
||||
<div class="fullwidthbanner">...</div>
|
||||
|
||||
</div></pre>
|
||||
<p>
|
||||
</p>
|
||||
<p>
|
||||
The CSS is not splitted with Media-Queries but has a basic 100% value for width:</p>
|
||||
<p>
|
||||
</p>
|
||||
<pre class="brush: css">
|
||||
.fullwidthbanner-container{
|
||||
width:100% !important;<span class="Apple-tab-span" style="white-space:pre"> </span>
|
||||
position:relative;
|
||||
padding:0;<span class="Apple-tab-span" style="white-space:pre"> </span>
|
||||
max-height:450px !important; // Same value as in OPTIONS the <strong>startheight</strong> parameter
|
||||
overflow:hidden;
|
||||
}
|
||||
</pre>
|
||||
<p>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section id="publicapi">
|
||||
<h3>API Functions and Events</h3><hr class="notop">
|
||||
<p> The slider offers a public API which you can use to control component inside the Slider from within your own scripts. To access this api, use the following code.</p>
|
||||
<pre class="brush: css">
|
||||
var tpj=jQuery;
|
||||
tpj.noConflict();
|
||||
|
||||
tpj(document).ready(function() {
|
||||
|
||||
if (tpj.fn.cssOriginal!=undefined)
|
||||
tpj.fn.css = tpj.fn.cssOriginal;
|
||||
|
||||
var api = tpj('.banner').revolution(
|
||||
....
|
||||
</pre>
|
||||
<p>You can see in the example index-responsive-API.html how to use the different functions, and how to get the trigered Events.</p>
|
||||
<p>Once this is done you may use any of the following functions:</p>
|
||||
<ul>
|
||||
<li><strong>api.revpause()</strong> - Stops the Timer and autoplay</li>
|
||||
<li><strong>api.revresume()</strong> - Starts the Timer and resume to autoplay</li>
|
||||
<li><strong>api.revprev()</strong> - Change to previous slide</li>
|
||||
<li><strong>api.revnext()</strong> - Change to next slide</li>
|
||||
<li><strong>api.revshowslide(n)</strong> - Change to the slide with index Nr. (n)</li>
|
||||
<li><strong>api.revmaxslide()</strong> - Show the amount of slides</li>
|
||||
</ul>
|
||||
<p>Or you may use any of the following Events:</p>
|
||||
<ul>
|
||||
<li><strong>revolution.slide.onchange</strong> - Event is triggered when Slide has been rotated</li>
|
||||
<li><strong>revolution.slide.onpause</strong> - Event is triggered when Slider is on Pause</li>
|
||||
<li><strong>revolution.slide.onresume</strong> - Event is triggered when Slider is back from Pause</li>
|
||||
<li><strong>revolution.slide.onvideoplay</strong> - Event is triggered when YouTube or Vimeo Video has been started (only Online Mode !)</li>
|
||||
<li><strong>revolution.slide.onvideostop</strong> - Event is triggered when YouTube or Vimeo Video has been stopped or Slide has been rotated (only Online Mode !)</li>
|
||||
<li><strong>revolution.slide.onstop</strong> - - Event is triggered when slider has been stopped due the Loop and stop at Slide parameters</li>
|
||||
<li><strong>revolution.slide.onbeforeswap</strong> - - Event is triggered when slider is going to change to next slide</li>
|
||||
<li><strong>revolution.slide.onafterswap</strong> - - Event is triggered when slider has finnishded the change of the transition (full transition finnished)</li>
|
||||
<li><strong>revolution.slide.onloaded</strong> - - Event is triggered when slider is loaded and it is prepared</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section id="licenses">
|
||||
<h3>Licenses</h3><hr class="notop">
|
||||
<p> Used Assets</p>
|
||||
<ul> <li> Template demo images licensed from <a href="http://us.fotolia.com">Fotolia</a> for preview usage. Please do not attempt to rip the images from the preview!</li>
|
||||
<li> <a href="http://cortys.de/cssAnimate/">cssAnimate Plugin</a> Great and Simple cssAnimate jQuery Plugin</li>
|
||||
<li> WaitForImages jQuery Plugin</li>
|
||||
<li> <a href="http://www.netcu.de/jquery-touchwipe-iphone-ipad-library">Touch Wipe jQuery Plugin</a></li>
|
||||
</ul>
|
||||
<p> </p>
|
||||
</section>
|
||||
<section id="support">
|
||||
<h3>Support</h3><hr class="notop">
|
||||
<p> If you face problems with the installation or customization of our product please do not hesitate to contact us via our support ticket system:</p>
|
||||
<p> <strong><a href="http://themepunch.ticksy.com">http://themepunch.ticksy.com</a></strong></p>
|
||||
|
||||
|
||||
</section>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
@@ -0,0 +1,205 @@
|
||||
/*
|
||||
* jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
|
||||
*
|
||||
* Uses the built in easing capabilities added In jQuery 1.1
|
||||
* to offer multiple easing options
|
||||
*
|
||||
* TERMS OF USE - jQuery Easing
|
||||
*
|
||||
* Open source under the BSD License.
|
||||
*
|
||||
* Copyright © 2008 George McGinley Smith
|
||||
* All rights reserved.
|
||||
*
|
||||
* Redistribution and use in source and binary forms, with or without modification,
|
||||
* are permitted provided that the following conditions are met:
|
||||
*
|
||||
* Redistributions of source code must retain the above copyright notice, this list of
|
||||
* conditions and the following disclaimer.
|
||||
* Redistributions in binary form must reproduce the above copyright notice, this list
|
||||
* of conditions and the following disclaimer in the documentation and/or other materials
|
||||
* provided with the distribution.
|
||||
*
|
||||
* Neither the name of the author nor the names of contributors may be used to endorse
|
||||
* or promote products derived from this software without specific prior written permission.
|
||||
*
|
||||
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
|
||||
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
|
||||
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
|
||||
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
||||
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
|
||||
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
|
||||
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
|
||||
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
|
||||
* OF THE POSSIBILITY OF SUCH DAMAGE.
|
||||
*
|
||||
*/
|
||||
|
||||
// t: current time, b: begInnIng value, c: change In value, d: duration
|
||||
jQuery.easing['jswing'] = jQuery.easing['swing'];
|
||||
|
||||
jQuery.extend( jQuery.easing,
|
||||
{
|
||||
def: 'easeOutQuad',
|
||||
swing: function (x, t, b, c, d) {
|
||||
//alert(jQuery.easing.default);
|
||||
return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
|
||||
},
|
||||
easeInQuad: function (x, t, b, c, d) {
|
||||
return c*(t/=d)*t + b;
|
||||
},
|
||||
easeOutQuad: function (x, t, b, c, d) {
|
||||
return -c *(t/=d)*(t-2) + b;
|
||||
},
|
||||
easeInOutQuad: function (x, t, b, c, d) {
|
||||
if ((t/=d/2) < 1) return c/2*t*t + b;
|
||||
return -c/2 * ((--t)*(t-2) - 1) + b;
|
||||
},
|
||||
easeInCubic: function (x, t, b, c, d) {
|
||||
return c*(t/=d)*t*t + b;
|
||||
},
|
||||
easeOutCubic: function (x, t, b, c, d) {
|
||||
return c*((t=t/d-1)*t*t + 1) + b;
|
||||
},
|
||||
easeInOutCubic: function (x, t, b, c, d) {
|
||||
if ((t/=d/2) < 1) return c/2*t*t*t + b;
|
||||
return c/2*((t-=2)*t*t + 2) + b;
|
||||
},
|
||||
easeInQuart: function (x, t, b, c, d) {
|
||||
return c*(t/=d)*t*t*t + b;
|
||||
},
|
||||
easeOutQuart: function (x, t, b, c, d) {
|
||||
return -c * ((t=t/d-1)*t*t*t - 1) + b;
|
||||
},
|
||||
easeInOutQuart: function (x, t, b, c, d) {
|
||||
if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
|
||||
return -c/2 * ((t-=2)*t*t*t - 2) + b;
|
||||
},
|
||||
easeInQuint: function (x, t, b, c, d) {
|
||||
return c*(t/=d)*t*t*t*t + b;
|
||||
},
|
||||
easeOutQuint: function (x, t, b, c, d) {
|
||||
return c*((t=t/d-1)*t*t*t*t + 1) + b;
|
||||
},
|
||||
easeInOutQuint: function (x, t, b, c, d) {
|
||||
if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
|
||||
return c/2*((t-=2)*t*t*t*t + 2) + b;
|
||||
},
|
||||
easeInSine: function (x, t, b, c, d) {
|
||||
return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
|
||||
},
|
||||
easeOutSine: function (x, t, b, c, d) {
|
||||
return c * Math.sin(t/d * (Math.PI/2)) + b;
|
||||
},
|
||||
easeInOutSine: function (x, t, b, c, d) {
|
||||
return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
|
||||
},
|
||||
easeInExpo: function (x, t, b, c, d) {
|
||||
return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
|
||||
},
|
||||
easeOutExpo: function (x, t, b, c, d) {
|
||||
return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
|
||||
},
|
||||
easeInOutExpo: function (x, t, b, c, d) {
|
||||
if (t==0) return b;
|
||||
if (t==d) return b+c;
|
||||
if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
|
||||
return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
|
||||
},
|
||||
easeInCirc: function (x, t, b, c, d) {
|
||||
return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
|
||||
},
|
||||
easeOutCirc: function (x, t, b, c, d) {
|
||||
return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
|
||||
},
|
||||
easeInOutCirc: function (x, t, b, c, d) {
|
||||
if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
|
||||
return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
|
||||
},
|
||||
easeInElastic: function (x, t, b, c, d) {
|
||||
var s=1.70158;var p=0;var a=c;
|
||||
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
|
||||
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
||||
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
||||
return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
|
||||
},
|
||||
easeOutElastic: function (x, t, b, c, d) {
|
||||
var s=1.70158;var p=0;var a=c;
|
||||
if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
|
||||
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
||||
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
||||
return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
|
||||
},
|
||||
easeInOutElastic: function (x, t, b, c, d) {
|
||||
var s=1.70158;var p=0;var a=c;
|
||||
if (t==0) return b; if ((t/=d/2)==2) return b+c; if (!p) p=d*(.3*1.5);
|
||||
if (a < Math.abs(c)) { a=c; var s=p/4; }
|
||||
else var s = p/(2*Math.PI) * Math.asin (c/a);
|
||||
if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
|
||||
return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
|
||||
},
|
||||
easeInBack: function (x, t, b, c, d, s) {
|
||||
if (s == undefined) s = 1.70158;
|
||||
return c*(t/=d)*t*((s+1)*t - s) + b;
|
||||
},
|
||||
easeOutBack: function (x, t, b, c, d, s) {
|
||||
if (s == undefined) s = 1.70158;
|
||||
return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
|
||||
},
|
||||
easeInOutBack: function (x, t, b, c, d, s) {
|
||||
if (s == undefined) s = 1.70158;
|
||||
if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
|
||||
return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
|
||||
},
|
||||
easeInBounce: function (x, t, b, c, d) {
|
||||
return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
|
||||
},
|
||||
easeOutBounce: function (x, t, b, c, d) {
|
||||
if ((t/=d) < (1/2.75)) {
|
||||
return c*(7.5625*t*t) + b;
|
||||
} else if (t < (2/2.75)) {
|
||||
return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
|
||||
} else if (t < (2.5/2.75)) {
|
||||
return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
|
||||
} else {
|
||||
return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
|
||||
}
|
||||
},
|
||||
easeInOutBounce: function (x, t, b, c, d) {
|
||||
if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b;
|
||||
return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b;
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
*
|
||||
* TERMS OF USE - EASING EQUATIONS
|
||||
*
|
||||
* Open source under the BSD License.
|
||||
*
|
||||
* Copyright © 2001 Robert Penner
|
||||
* All rights reserved.
|
||||
*
|
||||
* Redistribution and use in source and binary forms, with or without modification,
|
||||
* are permitted provided that the following conditions are met:
|
||||
*
|
||||
* Redistributions of source code must retain the above copyright notice, this list of
|
||||
* conditions and the following disclaimer.
|
||||
* Redistributions in binary form must reproduce the above copyright notice, this list
|
||||
* of conditions and the following disclaimer in the documentation and/or other materials
|
||||
* provided with the distribution.
|
||||
*
|
||||
* Neither the name of the author nor the names of contributors may be used to endorse
|
||||
* or promote products derived from this software without specific prior written permission.
|
||||
*
|
||||
* THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY
|
||||
* EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
|
||||
* MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
|
||||
* COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
||||
* EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
|
||||
* GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
|
||||
* AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
|
||||
* NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
|
||||
* OF THE POSSIBILITY OF SUCH DAMAGE.
|
||||
*
|
||||
*/
|
||||
11
website/Boson/Revolution Slider Documentation/js/jquery.scrollTo-1.4.2-min.js
vendored
Normal file
11
website/Boson/Revolution Slider Documentation/js/jquery.scrollTo-1.4.2-min.js
vendored
Normal file
@@ -0,0 +1,11 @@
|
||||
/**
|
||||
* jQuery.ScrollTo - Easy element scrolling using jQuery.
|
||||
* Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
|
||||
* Dual licensed under MIT and GPL.
|
||||
* Date: 5/25/2009
|
||||
* @author Ariel Flesler
|
||||
* @version 1.4.2
|
||||
*
|
||||
* http://flesler.blogspot.com/2007/10/jqueryscrollto.html
|
||||
*/
|
||||
;(function(d){var k=d.scrollTo=function(a,i,e){d(window).scrollTo(a,i,e)};k.defaults={axis:'xy',duration:parseFloat(d.fn.jquery)>=1.3?0:1};k.window=function(a){return d(window)._scrollable()};d.fn._scrollable=function(){return this.map(function(){var a=this,i=!a.nodeName||d.inArray(a.nodeName.toLowerCase(),['iframe','#document','html','body'])!=-1;if(!i)return a;var e=(a.contentWindow||a).document||a.ownerDocument||a;return d.browser.safari||e.compatMode=='BackCompat'?e.body:e.documentElement})};d.fn.scrollTo=function(n,j,b){if(typeof j=='object'){b=j;j=0}if(typeof b=='function')b={onAfter:b};if(n=='max')n=9e9;b=d.extend({},k.defaults,b);j=j||b.speed||b.duration;b.queue=b.queue&&b.axis.length>1;if(b.queue)j/=2;b.offset=p(b.offset);b.over=p(b.over);return this._scrollable().each(function(){var q=this,r=d(q),f=n,s,g={},u=r.is('html,body');switch(typeof f){case'number':case'string':if(/^([+-]=)?\d+(\.\d+)?(px|%)?$/.test(f)){f=p(f);break}f=d(f,this);case'object':if(f.is||f.style)s=(f=d(f)).offset()}d.each(b.axis.split(''),function(a,i){var e=i=='x'?'Left':'Top',h=e.toLowerCase(),c='scroll'+e,l=q[c],m=k.max(q,i);if(s){g[c]=s[h]+(u?0:l-r.offset()[h]);if(b.margin){g[c]-=parseInt(f.css('margin'+e))||0;g[c]-=parseInt(f.css('border'+e+'Width'))||0}g[c]+=b.offset[h]||0;if(b.over[h])g[c]+=f[i=='x'?'width':'height']()*b.over[h]}else{var o=f[h];g[c]=o.slice&&o.slice(-1)=='%'?parseFloat(o)/100*m:o}if(/^\d+$/.test(g[c]))g[c]=g[c]<=0?0:Math.min(g[c],m);if(!a&&b.queue){if(l!=g[c])t(b.onAfterFirst);delete g[c]}});t(b.onAfter);function t(a){r.animate(g,j,b.easing,a&&function(){a.call(this,n,b)})}}).end()};k.max=function(a,i){var e=i=='x'?'Width':'Height',h='scroll'+e;if(!d(a).is('html,body'))return a[h]-d(a)[e.toLowerCase()]();var c='client'+e,l=a.ownerDocument.documentElement,m=a.ownerDocument.body;return Math.max(l[h],m[h])-Math.min(l[c],m[c])};function p(a){return typeof a=='object'?a:{top:a,left:a}}})(jQuery);
|
||||
159
website/Boson/Revolution Slider Documentation/js/script.js
Normal file
159
website/Boson/Revolution Slider Documentation/js/script.js
Normal file
@@ -0,0 +1,159 @@
|
||||
/*!
|
||||
* Documenter 1.6
|
||||
* http://rxa.li/documenter
|
||||
*
|
||||
* Copyright 2011, Xaver Birsak
|
||||
* http://revaxarts.com
|
||||
*
|
||||
*/
|
||||
//if Cufon replace headings
|
||||
if(typeof Cufon == 'function') Cufon.replace('h1, h2, h3, h4, h5, h6');
|
||||
|
||||
$(document).ready(function() {
|
||||
var timeout,
|
||||
sections = new Array(),
|
||||
sectionscount = 0,
|
||||
win = $(window),
|
||||
sidebar = $('#documenter_sidebar'),
|
||||
nav = $('#documenter_nav'),
|
||||
logo = $('#documenter_logo'),
|
||||
navanchors = nav.find('a'),
|
||||
timeoffset = 50,
|
||||
hash = location.hash || null;
|
||||
iDeviceNotOS4 = (navigator.userAgent.match(/iphone|ipod|ipad/i) && !navigator.userAgent.match(/OS 5/i)) || false,
|
||||
badIE = $('html').prop('class').match(/ie(6|7|8)/)|| false;
|
||||
|
||||
//handle external links (new window)
|
||||
$('a[href^=http]').bind('click',function(){
|
||||
window.open($(this).attr('href'));
|
||||
return false;
|
||||
});
|
||||
|
||||
//IE 8 and lower doesn't like the smooth pagescroll
|
||||
if(!badIE){
|
||||
window.scroll(0,0);
|
||||
|
||||
$('a[href^=#]').bind('click touchstart',function(){
|
||||
hash = $(this).attr('href');
|
||||
$.scrollTo.window().queue([]).stop();
|
||||
goTo(hash);
|
||||
return false;
|
||||
});
|
||||
|
||||
//if a hash is set => go to it
|
||||
if(hash){
|
||||
setTimeout(function(){
|
||||
goTo(hash);
|
||||
},500);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//We need the position of each section until the full page with all images is loaded
|
||||
win.bind('load',function(){
|
||||
|
||||
var sectionselector = 'section';
|
||||
|
||||
//Documentation has subcategories
|
||||
if(nav.find('ol').length){
|
||||
sectionselector = 'section, h4';
|
||||
}
|
||||
//saving some information
|
||||
$(sectionselector).each(function(i,e){
|
||||
var _this = $(this);
|
||||
var p = {
|
||||
id: this.id,
|
||||
pos: _this.offset().top
|
||||
};
|
||||
sections.push(p);
|
||||
});
|
||||
|
||||
|
||||
//iPhone, iPod and iPad don't trigger the scroll event
|
||||
if(iDeviceNotOS4){
|
||||
nav.find('a').bind('click',function(){
|
||||
setTimeout(function(){
|
||||
win.trigger('scroll');
|
||||
},duration);
|
||||
|
||||
});
|
||||
//scroll to top
|
||||
window.scroll(0,0);
|
||||
}
|
||||
|
||||
//how many sections
|
||||
sectionscount = sections.length;
|
||||
|
||||
//bind the handler to the scroll event
|
||||
win.bind('scroll',function(event){
|
||||
clearInterval(timeout);
|
||||
//should occur with a delay
|
||||
timeout = setTimeout(function(){
|
||||
//get the position from the very top in all browsers
|
||||
pos = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
|
||||
|
||||
//iDeviceNotOS4s don't know the fixed property so we fake it
|
||||
if(iDeviceNotOS4){
|
||||
sidebar.css({height:document.height});
|
||||
logo.css({'margin-top':pos});
|
||||
}
|
||||
//activate Nav element at the current position
|
||||
activateNav(pos);
|
||||
},timeoffset);
|
||||
}).trigger('scroll');
|
||||
|
||||
});
|
||||
|
||||
//the function is called when the hash changes
|
||||
function hashchange(){
|
||||
goTo(location.hash, false);
|
||||
}
|
||||
|
||||
//scroll to a section and set the hash
|
||||
function goTo(hash,changehash){
|
||||
win.unbind('hashchange', hashchange);
|
||||
hash = hash.replace(/!\//,'');
|
||||
win.stop().scrollTo(hash,duration,{
|
||||
easing:easing,
|
||||
axis:'y'
|
||||
});
|
||||
if(changehash !== false){
|
||||
var l = location;
|
||||
location.href = (l.protocol+'//'+l.host+l.pathname+'#!/'+hash.substr(1));
|
||||
}
|
||||
win.bind('hashchange', hashchange);
|
||||
}
|
||||
|
||||
|
||||
//activate current nav element
|
||||
function activateNav(pos){
|
||||
var offset = 100,
|
||||
current, next, parent, isSub, hasSub;
|
||||
win.unbind('hashchange', hashchange);
|
||||
for(var i=sectionscount;i>0;i--){
|
||||
if(sections[i-1].pos <= pos+offset){
|
||||
navanchors.removeClass('current');
|
||||
current = navanchors.eq(i-1);
|
||||
current.addClass('current');
|
||||
|
||||
parent = current.parent().parent();
|
||||
next = current.next();
|
||||
|
||||
hasSub = next.is('ol');
|
||||
isSub = !parent.is('#documenter_nav');
|
||||
|
||||
nav.find('ol:visible').not(parent).slideUp('fast');
|
||||
if(isSub){
|
||||
parent.prev().addClass('current');
|
||||
parent.stop().slideDown('fast');
|
||||
}else if(hasSub){
|
||||
next.stop().slideDown('fast');
|
||||
}
|
||||
win.bind('hashchange', hashchange);
|
||||
break;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
91
website/Boson/Revolution Slider Documentation/js/shBrushCss.js
vendored
Normal file
91
website/Boson/Revolution Slider Documentation/js/shBrushCss.js
vendored
Normal file
@@ -0,0 +1,91 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
;(function()
|
||||
{
|
||||
// CommonJS
|
||||
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
|
||||
|
||||
function Brush()
|
||||
{
|
||||
function getKeywordsCSS(str)
|
||||
{
|
||||
return '\\b([a-z_]|)' + str.replace(/ /g, '(?=:)\\b|\\b([a-z_\\*]|\\*|)') + '(?=:)\\b';
|
||||
};
|
||||
|
||||
function getValuesCSS(str)
|
||||
{
|
||||
return '\\b' + str.replace(/ /g, '(?!-)(?!:)\\b|\\b()') + '\:\\b';
|
||||
};
|
||||
|
||||
var keywords = 'ascent azimuth background-attachment background-color background-image background-position ' +
|
||||
'background-repeat background baseline bbox border-collapse border-color border-spacing border-style border-top ' +
|
||||
'border-right border-bottom border-left border-top-color border-right-color border-bottom-color border-left-color ' +
|
||||
'border-top-style border-right-style border-bottom-style border-left-style border-top-width border-right-width ' +
|
||||
'border-bottom-width border-left-width border-width border bottom cap-height caption-side centerline clear clip color ' +
|
||||
'content counter-increment counter-reset cue-after cue-before cue cursor definition-src descent direction display ' +
|
||||
'elevation empty-cells float font-size-adjust font-family font-size font-stretch font-style font-variant font-weight font ' +
|
||||
'height left letter-spacing line-height list-style-image list-style-position list-style-type list-style margin-top ' +
|
||||
'margin-right margin-bottom margin-left margin marker-offset marks mathline max-height max-width min-height min-width orphans ' +
|
||||
'outline-color outline-style outline-width outline overflow padding-top padding-right padding-bottom padding-left padding page ' +
|
||||
'page-break-after page-break-before page-break-inside pause pause-after pause-before pitch pitch-range play-during position ' +
|
||||
'quotes right richness size slope src speak-header speak-numeral speak-punctuation speak speech-rate stemh stemv stress ' +
|
||||
'table-layout text-align top text-decoration text-indent text-shadow text-transform unicode-bidi unicode-range units-per-em ' +
|
||||
'vertical-align visibility voice-family volume white-space widows width widths word-spacing x-height z-index';
|
||||
|
||||
var values = 'above absolute all always aqua armenian attr aural auto avoid baseline behind below bidi-override black blink block blue bold bolder '+
|
||||
'both bottom braille capitalize caption center center-left center-right circle close-quote code collapse compact condensed '+
|
||||
'continuous counter counters crop cross crosshair cursive dashed decimal decimal-leading-zero default digits disc dotted double '+
|
||||
'embed embossed e-resize expanded extra-condensed extra-expanded fantasy far-left far-right fast faster fixed format fuchsia '+
|
||||
'gray green groove handheld hebrew help hidden hide high higher icon inline-table inline inset inside invert italic '+
|
||||
'justify landscape large larger left-side left leftwards level lighter lime line-through list-item local loud lower-alpha '+
|
||||
'lowercase lower-greek lower-latin lower-roman lower low ltr marker maroon medium message-box middle mix move narrower '+
|
||||
'navy ne-resize no-close-quote none no-open-quote no-repeat normal nowrap n-resize nw-resize oblique olive once open-quote outset '+
|
||||
'outside overline pointer portrait pre print projection purple red relative repeat repeat-x repeat-y rgb ridge right right-side '+
|
||||
'rightwards rtl run-in screen scroll semi-condensed semi-expanded separate se-resize show silent silver slower slow '+
|
||||
'small small-caps small-caption smaller soft solid speech spell-out square s-resize static status-bar sub super sw-resize '+
|
||||
'table-caption table-cell table-column table-column-group table-footer-group table-header-group table-row table-row-group teal '+
|
||||
'text-bottom text-top thick thin top transparent tty tv ultra-condensed ultra-expanded underline upper-alpha uppercase upper-latin '+
|
||||
'upper-roman url visible wait white wider w-resize x-fast x-high x-large x-loud x-low x-slow x-small x-soft xx-large xx-small yellow';
|
||||
|
||||
var fonts = '[mM]onospace [tT]ahoma [vV]erdana [aA]rial [hH]elvetica [sS]ans-serif [sS]erif [cC]ourier mono sans serif';
|
||||
|
||||
this.regexList = [
|
||||
{ regex: SyntaxHighlighter.regexLib.multiLineCComments, css: 'comments' }, // multiline comments
|
||||
{ regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' }, // double quoted strings
|
||||
{ regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' }, // single quoted strings
|
||||
{ regex: /\#[a-fA-F0-9]{3,6}/g, css: 'value' }, // html colors
|
||||
{ regex: /(-?\d+)(\.\d+)?(px|em|pt|\:|\%|)/g, css: 'value' }, // sizes
|
||||
{ regex: /!important/g, css: 'color3' }, // !important
|
||||
{ regex: new RegExp(getKeywordsCSS(keywords), 'gm'), css: 'keyword' }, // keywords
|
||||
{ regex: new RegExp(getValuesCSS(values), 'g'), css: 'value' }, // values
|
||||
{ regex: new RegExp(this.getKeywords(fonts), 'g'), css: 'color1' } // fonts
|
||||
];
|
||||
|
||||
this.forHtmlScript({
|
||||
left: /(<|<)\s*style.*?(>|>)/gi,
|
||||
right: /(<|<)\/\s*style\s*(>|>)/gi
|
||||
});
|
||||
};
|
||||
|
||||
Brush.prototype = new SyntaxHighlighter.Highlighter();
|
||||
Brush.aliases = ['css'];
|
||||
|
||||
SyntaxHighlighter.brushes.CSS = Brush;
|
||||
|
||||
// CommonJS
|
||||
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
|
||||
})();
|
||||
52
website/Boson/Revolution Slider Documentation/js/shBrushJScript.js
vendored
Normal file
52
website/Boson/Revolution Slider Documentation/js/shBrushJScript.js
vendored
Normal file
@@ -0,0 +1,52 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
;(function()
|
||||
{
|
||||
// CommonJS
|
||||
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
|
||||
|
||||
function Brush()
|
||||
{
|
||||
var keywords = 'break case catch continue ' +
|
||||
'default delete do else false ' +
|
||||
'for function if in instanceof ' +
|
||||
'new null return super switch ' +
|
||||
'this throw true try typeof var while with'
|
||||
;
|
||||
|
||||
var r = SyntaxHighlighter.regexLib;
|
||||
|
||||
this.regexList = [
|
||||
{ regex: r.multiLineDoubleQuotedString, css: 'string' }, // double quoted strings
|
||||
{ regex: r.multiLineSingleQuotedString, css: 'string' }, // single quoted strings
|
||||
{ regex: r.singleLineCComments, css: 'comments' }, // one line comments
|
||||
{ regex: r.multiLineCComments, css: 'comments' }, // multiline comments
|
||||
{ regex: /\s*#.*/gm, css: 'preprocessor' }, // preprocessor tags like #region and #endregion
|
||||
{ regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' } // keywords
|
||||
];
|
||||
|
||||
this.forHtmlScript(r.scriptScriptTags);
|
||||
};
|
||||
|
||||
Brush.prototype = new SyntaxHighlighter.Highlighter();
|
||||
Brush.aliases = ['js', 'jscript', 'javascript'];
|
||||
|
||||
SyntaxHighlighter.brushes.JScript = Brush;
|
||||
|
||||
// CommonJS
|
||||
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
|
||||
})();
|
||||
69
website/Boson/Revolution Slider Documentation/js/shBrushXml.js
vendored
Normal file
69
website/Boson/Revolution Slider Documentation/js/shBrushXml.js
vendored
Normal file
@@ -0,0 +1,69 @@
|
||||
/**
|
||||
* SyntaxHighlighter
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter
|
||||
*
|
||||
* SyntaxHighlighter is donationware. If you are using it, please donate.
|
||||
* http://alexgorbatchev.com/SyntaxHighlighter/donate.html
|
||||
*
|
||||
* @version
|
||||
* 3.0.83 (July 02 2010)
|
||||
*
|
||||
* @copyright
|
||||
* Copyright (C) 2004-2010 Alex Gorbatchev.
|
||||
*
|
||||
* @license
|
||||
* Dual licensed under the MIT and GPL licenses.
|
||||
*/
|
||||
;(function()
|
||||
{
|
||||
// CommonJS
|
||||
typeof(require) != 'undefined' ? SyntaxHighlighter = require('shCore').SyntaxHighlighter : null;
|
||||
|
||||
function Brush()
|
||||
{
|
||||
function process(match, regexInfo)
|
||||
{
|
||||
var constructor = SyntaxHighlighter.Match,
|
||||
code = match[0],
|
||||
tag = new XRegExp('(<|<)[\\s\\/\\?]*(?<name>[:\\w-\\.]+)', 'xg').exec(code),
|
||||
result = []
|
||||
;
|
||||
|
||||
if (match.attributes != null)
|
||||
{
|
||||
var attributes,
|
||||
regex = new XRegExp('(?<name> [\\w:\\-\\.]+)' +
|
||||
'\\s*=\\s*' +
|
||||
'(?<value> ".*?"|\'.*?\'|\\w+)',
|
||||
'xg');
|
||||
|
||||
while ((attributes = regex.exec(code)) != null)
|
||||
{
|
||||
result.push(new constructor(attributes.name, match.index + attributes.index, 'color1'));
|
||||
result.push(new constructor(attributes.value, match.index + attributes.index + attributes[0].indexOf(attributes.value), 'string'));
|
||||
}
|
||||
}
|
||||
|
||||
if (tag != null)
|
||||
result.push(
|
||||
new constructor(tag.name, match.index + tag[0].indexOf(tag.name), 'keyword')
|
||||
);
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
this.regexList = [
|
||||
{ regex: new XRegExp('(\\<|<)\\!\\[[\\w\\s]*?\\[(.|\\s)*?\\]\\](\\>|>)', 'gm'), css: 'color2' }, // <![ ... [ ... ]]>
|
||||
{ regex: SyntaxHighlighter.regexLib.xmlComments, css: 'comments' }, // <!-- ... -->
|
||||
{ regex: new XRegExp('(<|<)[\\s\\/\\?]*(\\w+)(?<attributes>.*?)[\\s\\/\\?]*(>|>)', 'sg'), func: process }
|
||||
];
|
||||
};
|
||||
|
||||
Brush.prototype = new SyntaxHighlighter.Highlighter();
|
||||
Brush.aliases = ['xml', 'xhtml', 'xslt', 'html'];
|
||||
|
||||
SyntaxHighlighter.brushes.Xml = Brush;
|
||||
|
||||
// CommonJS
|
||||
typeof(exports) != 'undefined' ? exports.Brush = Brush : null;
|
||||
})();
|
||||
17
website/Boson/Revolution Slider Documentation/js/shCore.js
vendored
Normal file
17
website/Boson/Revolution Slider Documentation/js/shCore.js
vendored
Normal file
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user