在印象中面临问题.js旋转木马
Facing issue in Impress.js carousel
我正在尝试使用impress实现轮播.js类似于 http://demo.tutorialzine.com/2012/02/css3-product-showcase/#/music。
我尝试开发它,但遇到了一些问题,例如单击左侧或右侧图标时,屏幕正在向上和向下移动。我所做的工作已上传到我的服务器中。链接:http://think360apps.co.in/evdt/issued/index.html#intro
代码也给出如下:
<div class="animate-slider">
<div id="impress" class="impress-not-supported">
<div id="intro" class="step" data-x="0" data-y="0">
<h2>Introducing Galaxy Nexus</h2>
<p>Android 4.0<br /> Super Amoled 720p Screen<br /> 1.2 GHz Dual Core CPU<br /> 32 GB of storage<br /> Fast Camera</p>
<img src="assets/img/nexus_1.jpg" width="232" height="458" alt="Galaxy Nexus" />
</div>
<div id="simplicity" class="step" data-x="1100" data-y="1200" data-scale="1.8" data-rotate="190">
<h2>Simplicity in Android 4.0</h2>
<p>Android 4.0, Ice Cream Sandwich brings an entirely new look and feel to Android. Simple layouts with subtle animations and delightful flourishes make everything feel alive. </p>
<img src="assets/img/nexus_2.jpg" width="289" height="535" alt="Galaxy Nexus" />
</div>
<div id="connect" class="step" data-x="-300" data-y="600" data-scale="0.2" data-rotate="270">
<h2>Connect & Share</h2>
<p>Real-life sharing is nuanced and rich. Galaxy Nexus makes sharing with mobile devices just as easy at it is in person. </p>
<img src="assets/img/nexus_3.jpg" width="558" height="329" alt="Galaxy Nexus" />
</div>
<div id="upload" class="step" data-x="-200" data-y="1500" data-rotate="180">
<h2>Instant Upload</h2>
<p>Your photos upload themselves with Instant Upload, which makes it much easier to share them with family and friends.</p>
<img src="assets/img/nexus_4.jpg" width="248" height="510" alt="Galaxy Nexus" />
</div>
<div id="music" class="step" data-x="-1200" data-y="1000" data-scale="0.8" data-rotate="270">
<h2>Jam on with Google Music</h2>
<p>Google Music makes discovery, purchase, and listening effortless and fun. Store your entire collection for free, and stream your music to your Galaxy Nexus, computer, or other Android devices.</p>
<img src="assets/img/nexus_5.jpg" width="570" height="389" alt="Galaxy Nexus" />
</div>
</div>
<a id="arrowLeft" class="arrow"><</a>
<a id="arrowRight" class="arrow">></a>
请让我知道我哪里做错了。请帮忙。
你应该有以下代码来控制按钮:
<script>
$("#arrowRight").click(function () {
impress().next();
});
$("#arrowLeft").click(function () {
impress().prev();
});
</script>
顺便说一下,您提供的链接无效。
相关文章:
- 灯光问题(使用三个.js)
- angular js密码强度显示问题
- 我在启动我的节点时遇到问题.js IRC 机器人
- 节点中的 CORS 问题.js失败
- 关于骨干的几个问题.js
- 使用时刻验证日期时出现问题.js按格式
- 嵌入棋盘时遇到问题.js
- 在印象中面临问题.js旋转木马
- 高图表重新加载骨干网的问题.js
- 骨干问题.js和字母 ID 问题
- 重复出现问题(JS/HTML)
- 获取子字符串问题(js.或jquery)
- 实时滚动问题(JS)
- 事件处理问题JS
- CRM 2011 -动态更改表单问题- JS错误(无法执行代码…)
- 显示正确输出的问题.JS单选按钮的选择和添加
- 使用外部 dom 按钮在 Highchart 中向下和向上钻取的问题.js
- 复选框数组的问题 [JS, Jquery]
- 节点从 0.2.6 升级到 0.4.7 时出现超时问题.js
- 删除cookie问题JS-COOKIE