- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试使用类似于 http://demo.tutorialzine.com/2012/02/css3-product-showcase/#/music 的 impress.js 实现轮播.
我尝试开发它但遇到了一些问题,例如单击左侧或右侧图标时,屏幕会上下移动。我所做的工作已上传到我的服务器中。关联: 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>
顺便说一下,您提供的链接无效。
关于javascript - 在 Impress.js 轮播中面临问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35578429/
我正在试用 impress.js,但我想知道是否有一种方法可以更改某些幻灯片正文的背景颜色。我希望我的前 3 张幻灯片与其余幻灯片有不同的背景。 最佳答案 你不必求助于 javascript 来改变背
现在 Tab 在 Impress.js 中被禁用,只是移动到下一张幻灯片。即使我删除该代码并让它正常运行并专注于链接它也会崩溃 impress.js有没有人找到解决方案? 谢谢! 最佳答案 (我维护着
我发现了这个: impress().next(); impress().prev(); impress().goto(10); 但是我不知道怎么用?有什么方法可以实现两个简单的按钮,让它们向前滑动或向
我正在尝试为 impress.js 演示文稿中的每张幻灯片创建不同的过渡时间。我在一本关于 impress.js 的书中找到了下面的代码。但是在 JSLint 上检查它显示错误。我对 javascri
我正在为基于 Ruby on Rails 的网站使用印象派 gem。我们的数据库是mysql。印象表大约有 2M 条记录,这对 MySql 应该没有问题。表大小为 800M,这开始对我们的服务器造成负
就目前情况而言,这个问题不太适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您觉得这个问题可以改进并可能重新开放,visit
我查看了有关该主题的其他问题,并且知道我必须这样做: 我创建了按钮: 然后在页面底部,我有这个(这是取自另一个问题 here ): impress().init(); $("#next").c
我有一个关于 impress.js 的问题。我想在“步进幻灯片”类的 div 元素内使用元素符号列表,但我无法做到这一点。 这是不可能的还是如果是:你能指出我正在犯的错误吗?我使用的代码是:
这些是我的 impress.js 幻灯片。其中 2 个有视频。我只想让焦点幻灯片播放声音。每次播放幻灯片时,我都希望其余幻灯片静音。每张幻灯片都有一个 iframe,其中包含视频。 视频的播放列表脚本
我的 Ubuntu 桌面配置了双显示器。每当我启动 LibreOffice Impress 时,它都会使用两个屏幕,一个用于当前幻灯片和下一张幻灯片,另一个用于实际演示。 我想要的是只使用一台显示演示
我正在使用 impress.js 库进行演示。我想为 div 附加一个监听器,如果幻灯片有类 present active。然后,我想在幻灯片上显示一个计数器。我尝试使用 elem.addEventL
我关注了所有 the necessary steps使用 Admob 在我的 android 应用程序中添加横幅。 我已经将我的设备注册为测试设备,横幅显示如下: 但是,在 Google Play 上
我试着从 impress.js 开始创建一些 HTML/CSS3 演示文稿。 不幸的是,我连最简单的例子都无法运行。 Impress Demo
我正在使用 impress.js 进行明天的演示,我想知道的是如何(或者是否可能)让我的无序列表中的列表项在单击时一个一个地动画化,就像它可以在 powerpoint/prezi 中使用。 这是我的模
我正在用 php/mysql 编写横幅广告引擎。我不想使用 OpenX 或交 key 解决方案,因为会有一堆自定义功能,我宁愿不依赖于必须灵活适应的现有系统。 以下是我目前对印象架构的思考和方法: 通
我的 impress.js 幻灯片有图像,我想填满屏幕并居中,这是代码: Introduction 现在它看起来像下面这样
我正在尝试使用类似于 http://demo.tutorialzine.com/2012/02/css3-product-showcase/#/music 的 impress.js 实现轮播. 我尝试
我正在弄乱 impress.js。我想要 4 张幻灯片,并想让它看起来像中间有一个正方形。 我的代码是这样的: my first presentation using i
我刚刚查看了 impress.js 演示,它似乎是一个强大的工具。我对 CSS 不是很有经验,我想使用附加的 CSS 作为模板。 但是演示文稿的背景中有一个黄色圆圈/椭圆,我无法弄清楚 CSS 的哪一
不知何故,即使是最简单的 impress.js 幻灯片也不适合我:( http://dl.dropbox.com/u/655237/events/GTG.zip …,总是必须使用你的例子。
我是一名优秀的程序员,十分优秀!