Tag: jcarousel

Jcarousel – 在无限循环中首先显示最后一个图像

我想知道是否有人使用Jcarousel会有关于如何克隆或显示轮播的最后一个图像作为第一张图像的建议。 5张照片的示例,其中轮播显示3个图像,它目前看起来像这样: 1 – 2 – 3(4和5等待显示) 相反,这是我试图在加载时实现的: 5 – 1 – 2(3和4等待显示) 我目前使用的是以下设置: 换行:’循环’,滚动:1,自动:1, 我尝试了一个偏移量:-1但是这显示一个空白并且不起作用。 我还尝试了一个偏移来启动带有最后一个图像的轮播 – 但是,将包裹设置为’圆形’这也不起作用并使其他图像变为空白,直到您手动加载它们。 我已经尽力寻找自己的答案,但感谢您的帮助,谢谢您提前。 编辑:我也愿意接受可以做到这一点的不同脚本的建议 – 谢谢! 编辑#2:首先感谢那些评论。 进一步的研究:我发现这个网站(www.anothermag.com)能够很好地显示最后一张图像,我相信它是基于代码使用Jquery SerialScroll。 我还没试过这个,但看起来很有希望。 我的另一个想法是看看我是否可以将最后一个图像显示为Wordpress循环中的第一个,这样它仍然使用Jcarousel但硬编码最后一个图像。 将发布更多更新。 编辑#3:最终解决方案: 我已经选择了Sparky672下面的答案,因为我认为可以说Jcarousel截至今天没有能力这样做而不需要在加载前重新排列图像。 但是,如果有人对选项/替代方案感兴趣,我将使用Fred HQ的优秀剧本“Roundabout”。 我将使用的示例如下: http : //fredhq.com/projects/roundabout/demo/around 通过一些小的修改,它将完成我所需要的,而无需在装载部分进行太多工作。 设置将是为所有图像将不透明度设置为1,将倾斜设置为0,在设置间隔中添加自动滚动,将框的大小设置为相同大小。 这个特殊的旋转木马需要一个白色的分隔符,所以我将使用“围绕物体移动”的例子,使中间的“东西”成为一个白色的盒子,以隐藏被环绕的东西。 我希望这可以帮助别人。 再次感谢!

使用RequireJS + jQuery加载jCarousel

我正在尝试使用RequireJS加载一个名为jCarousel的java插件。 我的项目结构如下所示: [project root] assets app js app.js vendor jquery-2.1.0.js jquery.jcarousel-core.js require.js 我正在使用shim配置,所以我首先加载RequireJS,如下所示: 然后在app.js中,我有RequireJS的这个配置: requirejs.config({ “baseUrl”: “assets/js/vendor”, “paths”: { “app”: “../../app” }, “shim”: { “jquery.jcarousel-core.js”: [“jquery-2.1.0”] } }); // Load the main app module to start the app requirejs([“app/main”]); 当我使用此框架加载页面时,所有脚本似乎都加载了,但是我在浏览器控制台的jcarousel代码中出错: 未捕获的ReferenceError:未定义jQuery 这个错误似乎来自jQuery中的行 – 我不记得这个过程的技术名称 – ‘$’符号被映射到’jQuery’,例如: return Plugin; }; }(jQuery)); // THIS IS THE OFFENDING […]

JCarousel包装设置为’循环’错误

我正在尝试设置一个JCarousel实例,将wrap设置为循环,但是,我注意到我在Chrome中“检查元素”的问题,当幻灯片重复时,重复的 元素被添加到html中(它可以是在官方示例页面上查看)。 http://sorgalla.com/projects/jcarousel/examples/static_circular.html 我知道这是GitHub上的一个漏洞。 我只是想知道是否有人找到了临时解决方法。

当前幻灯片上的jcarousel自定义类

我在项目中使用jcarousel,我想知道是否有一种方法可以在当前幻灯片中添加自定义类。 我正在使用jcarousel一次显示更多幻灯片,因为在骨架示例中我可以看到我需要一个当前幻灯片上可用的自定义类,并且当幻灯片被另一个幻灯片替换时它将被删除。 我创造了一个小提琴 ,描绘了我正在制作的场景。 HTML: 11111 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur dui elit, feugiat vel augue ornare, scelerisque aliquam diam. Maecenas in velit quis nisl consequat ullamcorper. Ut at erat in nulla auctor pellentesque. 22222 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur dui elit, feugiat vel augue ornare, scelerisque […]

jQuery UI选项卡中的jQuery多个轮播在Internet Explorer和Chrome中无法正常工作

我在页面中遇到问题,其URL可以在下面看到: http://hero.mynet.com/new/ 页面中间底部有一个标签式结构。每个标签包含一个轮播工作。每个轮播项目(图像)在点击时都可以叠加显示。 我使用jQuery 1.3.2(我知道它已经老了,但由于其他依赖关系我无法改变),jQuery UI 1.7.3,jCarousel 0.2.8和FancyBox 1.3.4来构建它。 单击第2或第3个选项卡并单击上一个按钮时,可以在Internet Explorer和Chrome的屏幕截图中看到问题。 什么可以导致这种情况,我尝试了很多东西来解决这个问题,但没有解决我的问题。 您有什么推荐的吗? 由于这项工作的时间安排,很难将所有结构改为新结构。 现在已经回答了所有的答案 Internet Explorer屏幕截图 Chrome屏幕截图

你的DOM中有很多元素是不是很糟糕?

我正在为他们的商店橱窗制作房地产非交互式展示 。 我踢了jCarousel做我想做的事: 每个AJAX添加面板 接近当前集合的末尾,去和AJAX一些新面板并插入它们 这样可以正常工作,但是在前面的元素上调用jQuery的remove()会导致丑陋的碰撞。 我不确定调用hide()是否会释放任何资源,因为元素仍然存在(并且元素将在屏幕外无论如何)。 我已经看过了 ,并在回调中尝试了carousel.reset() 。 它只是清除所有元素。 这将在Windows XP上的Google Chrome上运行,并且只会在液晶电视上显示。 我想知道,如果我找不到合理的解决方案来删除额外的DOM元素,它会让我的应用程序爬行,还是Chrome会做一些聪明的垃圾收集? 或者,你会如何解决这个问题? 谢谢

JCarousel和Cufon没有合作:动画让cufon消失了

我正在使用cufon和jCarousel。 Carousel有五个项目,从右到左旋转 – 换句话说,它们离开屏幕左侧。 你可以在这里看到它。 http://www.foursquare.org/site/test 如果我将轮播保留为默认行为,它将转到第5张幻灯片,然后快速向右滑动,一切都正常显示。 如果我将旋转木马设置为’圆形’,则第一次旋转后,cufon标题会消失; 即,当第一张幻灯片附加到最后一张幻灯片的右侧时,它们不会与幻灯片的其余部分一起出现。 你知道我能做些什么来让jCarousel和Cufon合作或沟通,以便头条新闻在这种情况下不会消失吗? TTFN Travis

在博客post中加载jQuery会导致它冻结

我创建了一些人们可以复制并粘贴到他们网站的代码,它应该在blogspot中工作。 此代码需要jQuery和jCarousel插件。 我用 在运行我的javascript代码之前加载jQuery。 问题是一些博客模板已经加载了jQuery,然后运行上面的代码导致博客post永远不会加载(它只是停留在加载屏幕上)。 我可以在if (typeof jQuery == “undefined”)之后使用javascript加载它if (typeof jQuery == “undefined”)但是为了使jCarousel插件工作,必须首先加载jQuery,所以这会导致post加载但是轮播要打破。 有谁知道任何解决方案?

与’caroufredsel’jquery旋转木马的响应问题

我使用优秀的caroufredsel构建了一个响应式旋转木马,这些项目应该始终一次滚动一个并使用流体动画。 目前,在页面加载(或刷新)时,项目正确滚动(一次一个),但在重新调整浏览器窗口大小后,按下一个开始跳过2个或更多项目。 如果您然后刷新它修复问题,直到下一次更改屏幕宽度。 此外,动画仅在屏幕处于可能的最小宽度(一次可见1个项目)时才起作用,并且当两个或更多项目同时可见时,它不会起作用。 网站可以在这里看到。 目前,下面的代码正在触发插件(我确信当它被破坏并在屏幕重新resize后重新设置时会有一些挥之不去的注入的css或等效物将它全部抛弃,只是无法将其固定下来。 ..): $(document).ready(function() { $(“#guitars-gallery”).carouFredSel({ auto: false, circular: false, prev: ‘#prev’, next: ‘#next’, responsive : true, height : ‘auto’, scroll: 1, items : { width : 370, visible : { min : 1, max : 3 } } }); }); function doSomething() { $(‘#guitars-gallery’).trigger(‘destroy’, true); $(‘#guitars-gallery’).css({‘text-align’: ”,’float’: ”,’position’: ”,’top’: ”,’right’: […]

调用jquery jCarousel的next和prev函数?

我使用jCarousel创建滚动内容(请点击此http://sorgalla.com/projects/jcarousel/ )。 但是我不想使用默认的下一个和上一个按钮,所以我想创建2个按钮来处理click事件。 EX:我有2个这样的超链接: jQuery(document).ready(function() { // Initialise the first and second carousel by class selector. // Note that they use both the same configuration options (none in this case). jQuery(‘#scrollArea’).jcarousel({ scroll: 10 }); NEXT PREV 如何将next和prev函数绑定到上面的链接?