{"version": "2.0","name": "Revolution Responsive jQuery Slider","subline": "","username": "ThemePunch","created": "06/22/2012","website": "http://www.codecanyon.com/user/themepunch?ref=themepunch","update": "06/08/2013","update_today": true,"email": "info@themepunch.com","description": "","intro": "For support please checkout http://themepunch.ticksy.com !","button_1_text": "","button_2_text": "","button_3_text": "","button_1_url": "","button_2_url": "","button_3_url": "","sections": [{"title": "How to start","id": "how_to_start","content": "<p>\tThis 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>\n<p>\t </p>\n<h4>\n\tWhat files do I need to upload to my server?</h4>\n<p>\tPlease upload the rs-plugin folder to your server. In this folder you will find the following subfolders containing all of the items content:</p>\n<ul>\t<li>\t\tjs</li>\n\t<li>\t\tcss</li>\n\t<li>\t\tassets</li>\n</ul>\n<p>\tYou could use your own jQuery but we recommend loading it directly from the Google ressources (see later in this documentation).</p>\n<p>\tYou will find many <strong>examples</strong> in your downloaded zip under the <strong>examples&sources</strong> folder.. </p>\n<p>\t </p>\n<h4>\n\tImplement the jQuery</h4>\n<p>\tAdd the following lines to your HTML Head: </p>\n<pre class=\"js\">\n<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js></pre>\n<p>\t </p>\n<h4>\n\tAdd Revolution js and css files to your HTML page</h4>\n<div>\n\t </div>\n<div>\n\tAlso in the <HEAD> section:</div>\n<div>\n\t </div>\n<div>\n\t<pre class=\"html\">\n<!-- jQuery REVOLUTION Slider -->\n<script type="text/javascript" src="rs-plugin/js/jquery.themepunch.plugins.min.js"></script>\n<script type="text/javascript" src="rs-plugin/js/jquery.themepunch.revolution.min.js"></script>\n\n<!-- REVOLUTION BANNER CSS SETTINGS -->\n<link rel="stylesheet" type="text/css" href="rs-plugin/css/settings.css" media="screen" />\n</pre>\n\t<div>\n\t\t </div>\n</div>\n<div>\n\tThis contains the JS and CSS for the Slider itself and some helping modules .</div>\n<div>\n\t </div>\n<div>\n\t </div>\n<div>\n\t<h4>\n\t\tCreate a Container for the Banner</h4>\n\t<div>\n\t\t </div>\n\t<div>\n\t\tPut it in the HTML: (the class names used here are only examples. In our Example files we called them banner-container, fullwidthbanner-container and fullscreenbanner-container, different then here below ! )</div>\n\t<pre class=\"html\">\n<div class="bannercontainer">\n<div class="banner">...</div>\n</div>\n</pre>\n\t<div>\n\t\tThe Banner-container can have different Styling depending on that, which layout you wish to use. </div>\n\t<div>\n\t\t </div>\n\t<div>\n\t\t<h5>\n\t\t\tResponsive Style </h5>\n\t\t<p>\t\t\tThis Style allows you to creat predefined container sizes, undependent from sourrounding container, and create Medai Query (Browsr Size) Dependent responsive alterantives.</p>\n\t\t<p>\t\t\tIt requests</p>\n\t\t<ul>\t\t\t<li>\t\t\t\ta container with predefined Width and Height Attributes,</li>\n\t\t\t<li>\t\t\t\tMedia Query dependent Sizing. - this should be always with the same proportion. Means Width/Height should always have the same result !!!</li>\n\t\t</ul>\n\t\t<p>\t\t\tPut this in your CSS File (i.e) :</p>\n\t\t<pre class=\"css\">\n<strong>.bannercontainer</strong> {\npadding:0px;\nbackground-color:#fff;\nwidth:960px;\nposition:relative;\nposition:relative;\nmargin-left:auto;\nmargin-right:auto;\n}\n\n<strong>.banner</strong>{\nwidth:960px;\nheight:500px;\nposition:relative;\noverflow:hidden;\n}\n\n<strong>@media only screen and (min-width: 768px) and (max-width: 959px)</strong> {\n <span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span> .banner, .bannercontainer<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>{<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>width:760px; height:395px;}\n}\n\n\n<strong>@media only screen and (min-width: 480px) and (max-width: 767px)</strong> {\n .banner, .bannercontainer<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>{<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>width:480px; height:250px;<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>}\n}\n\n<strong>@media only screen and (min-width: 0px) and (max-width: 479px)</strong> {\n .banner, .bannercontainer<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>{<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>width:320px;height:166px;<span class=\"Apple-tab-span\" style=\"white-space:pre\"> </span>}\n}</pre>\n\t\t<div>\n\t\t\t </div>\n\t\t<h5>\n\t\t\tFullWidth Style</h5>\n\t\t<p>\t\t\tThis Style allows you to have the banner always fit in the maximum width of the Sourrounding Container. </p>\n\t\t<p>\t\t\tIt requests:</p>\n\t\t<ul>\t\t\t<li>\t\t\t\ta Fluid wrapping container (which will always change the size depending on browser size. I.e. width:100% etc.. </li>\n\t\t</ul>\n\t\t<p>\t\t\tPut this in your CSS File </p>\n\t\t<pre class=\"css\">\n.<strong>bannercontainer</strong>{\nwidth:100% !important;\nposition:relative;\npadding:0;\nmax-height:500px !important;\noverflow:hidden;\n}</pre>\n\t</div>\n\t<div>\n\t\t<h4>\n\t\t\t </h4>\n\t\t<h5>\n\t\t\tFullScreen Style</h5>\n\t\t<p>\t\t\tThis Style allows you to have a banner always fit in the maxium screensize. In Some option you can select containers which will reduce the height of the banner with the height of the container. See examples.</p>\n\t\t<p>\t\t\tIt requests:</p>\n\t\t<ul>\t\t\t<li>\t\t\t\ta fullwidth and fullheight wrapping container</li>\n\t\t</ul>\n\t\t<p>\t\t\tPut this in your CSS File</p>\n\t\t<pre class=\"css\">\n.<strong>bannercontainer</strong> {\nwidth:100% !important;\nposition:relative;\npadding:0;\nheight:100%;\n}</pre>\n\t\t<h4>\n\t\t\t </h4>\n\t\t<h4>\n\t\t\tCreate Your First Slides</h4>\n\t\t<p>\t\t\tCreate an Unordered list inside the banner container where each <li> element will correspond to one slide.</p>\n\t\t<p>\t\t\t </p>\n\t\t<pre class=\"html\">\n<ul>\n<!-- THE BOXSLIDE EFFECT EXAMPLES WITH LINK ON THE MAIN SLIDE EXAMPLE -->\n\n <li data-transition="boxslide" data-slotamount="7" data-link="http://www.google.de"> \n <img src="images/slides/image1.jpg">\n <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>\n <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>\n <div class="caption lfr medium_grey" data-x="510" data-y="210" data-speed="300" data-start="2000">UNLIMITED TRANSITIONS</div>\n </li>\n...\n</ul></pre>\n\t\t<div>\n\t\t\t </div>\n\t\t<h4>\n\t\t\tCall the jQuery Plugin to build the Slider (Options need to be set of course...)</h4>\n\t\t<p>\t\t\t </p>\n\t\t<pre class=\"js\">\n<script type="text/javascript">\n\n var tpj=jQuery;\n tpj.noConflict();\n tpj(document).ready(function() {\n if (tpj.fn.cssOriginal!=undefined)\n tpj.fn.css = tpj.fn.cssOriginal;\n tpj('.fullscre
![avatar](https://profile-avatar.csdnimg.cn/6b2ea2d510824682ac2af676104b9caf_abackcab.jpg!1)
毕业小助手
- 粉丝: 2768
- 资源: 5583
最新资源
- 基于COMSOL模拟的透反射相位计算与GH位移分析:光子晶体超表面的研究,透反射相位计算与COMSOL光子晶体超表面模拟研究,透反射相位(GH位移)的计算 COMSOL光子晶体超表面模拟 ,核心关键词
- GSYGithubAppFlutter-Kotlin资源
- 基于多极子分析的极化无关连续束缚态BICs与COMSOL光子晶体超表面模拟研究,极化无关连续束缚态BICs的多极子分析与COMSOL光子晶体超表面模拟研究,极化无关连续束缚态BICs(多极子分析) C
- 永磁同步电机死区效应补偿策略优化仿真:方向判断更准确,参数管理更便捷,永磁同步电机死区效应补偿策略仿真研究:基于方向判断与参数自动化的优化方案,永磁同步电机死区效应补偿策略研究仿真,该仿真利用已知的死
- 探索Off-Gamma点合并BICs的COMSOL光子晶体超表面模拟技术,基于Off-Gamma点的BICs合并及COMSOL光子晶体超表面模拟探究,Off-Gamma点处合并BICs COMSOL光
- 一维光栅拓扑结构中的BICs单向辐射:基于COMSOL光子晶体超表面的模拟研究,一维光栅拓扑结构中的BICs与超表面模拟:实现单向辐射与超强的光子晶体相互作用 ,一维光栅拓扑BICs单向辐射 COMS
- 抽水蓄能电站最佳调度方案研究:粒子群算法下的混合发电系统经济调度模型探索,抽水蓄能电站最佳调度方案研究:粒子群算法与经济模型的结合应用,抽水蓄能电站的最佳调度方案研究 关键词:抽水蓄能 最佳调度 粒子
- 基于C#的Modbus RTU Master从站串口调试工具源码:支持多种功能码与数据类型,采用Visual Studio 2019开发,实现高效的数据读写与格式转换,基于C#实现的Modbus RT
- 基于多目标控制与多智能体一致性优化的15kW 400V级四节点光储直流微网系统:采用粒子群算法的MPPT光伏与复合控制策略实现能量管理与稳定运行,基于多目标控制与多智能体一致性优化的4节点光储直流微网
- 基于Matlab Simulink平台的5MW海上永磁风电直驱系统研究:混合储能与矢量控制技术应用,基于Matlab Simulink平台的5MW海上永磁风电直驱系统研究:混合储能与矢量控制技术实践(
- KtAdmin-ChatGPT-AI人工智能资源
- 基于稀疏自适应逐级正交匹配追踪算法的大地电磁数据降噪与信号处理研究,基于多领域信号降噪的稀疏自适应逐级正交匹配追踪算法研究与应用,基于稀疏自适应逐级正交匹配追踪的大地电磁数据降噪方法 算法运行环境为M
- stratovirt-Rust资源
- **基于路-网耦合的电动汽车充电负荷时-空分布预测技术:交通流与环境温度影响下的研究**,电动汽车充电负荷时空分布预测与路网耦合关系研究:探讨时-空分布对交通流及环境温度影响下的移动负荷预测模型与应用
- 小象智慧门店-连锁门店收银POS+门店小程序商城-硬件开发资源
- form-create-移动应用开发资源
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
![feedback](https://img-home.csdnimg.cn/images/20220527035711.png)
![feedback](https://img-home.csdnimg.cn/images/20220527035711.png)
![feedback-tip](https://img-home.csdnimg.cn/images/20220527035111.png)