admin管理员组文章数量:1026989
On the site I'm working on the carousel seems to skip to the third image the first time you click on the next button when the page loads. Does anyone have any ideas as to why this is? I'm following the suggested layout from the bootstrap documentation.
On the site I'm working on the carousel seems to skip to the third image the first time you click on the next button when the page loads. Does anyone have any ideas as to why this is? I'm following the suggested layout from the bootstrap documentation.
Share Improve this question edited Apr 11, 2015 at 3:28 TheoretiCAL asked Jul 28, 2012 at 19:02 TheoretiCALTheoretiCAL 20.6k8 gold badges44 silver badges67 bronze badges 2- Side note: You might want to add the bootstrap-transition.js plugin in order to use CSS3 transitions when sliding. The carousel plugin will utilize it automatically. However, it is optional. – merv Commented Jul 28, 2012 at 20:34
- I am Experiencing the same issue in IE8, I checked to see that bootstrap.js contains the transition, i also tried re-instantiating the carousel on page load... any other ideas? – Johann Combrink Commented May 21, 2015 at 20:47
1 Answer
Reset to default 5There seems to be a problem with the initialization of the carousel.
When you click for the first time on the arrow, it initializes the carousel which triggers the first switch AND select the next slide because you clicked on the arrow (all at the same time).
A direct fix would be to add this code to initialize the carousel on loading (which also enable the automatic sliding) :
$(function() {
$('#myCarousel').carousel();
});
Be sure to include this after the plugin and everything should be okay.
Update
It also appears to be jumping to the 3rd only without the transition effect.
As suggested by merv you could include the bootstrap-transition.js file and it will resolve your problem.
Anyway, I submitted a ticket, for those who wants some follow-up : Issue on github
On the site I'm working on the carousel seems to skip to the third image the first time you click on the next button when the page loads. Does anyone have any ideas as to why this is? I'm following the suggested layout from the bootstrap documentation.
On the site I'm working on the carousel seems to skip to the third image the first time you click on the next button when the page loads. Does anyone have any ideas as to why this is? I'm following the suggested layout from the bootstrap documentation.
Share Improve this question edited Apr 11, 2015 at 3:28 TheoretiCAL asked Jul 28, 2012 at 19:02 TheoretiCALTheoretiCAL 20.6k8 gold badges44 silver badges67 bronze badges 2- Side note: You might want to add the bootstrap-transition.js plugin in order to use CSS3 transitions when sliding. The carousel plugin will utilize it automatically. However, it is optional. – merv Commented Jul 28, 2012 at 20:34
- I am Experiencing the same issue in IE8, I checked to see that bootstrap.js contains the transition, i also tried re-instantiating the carousel on page load... any other ideas? – Johann Combrink Commented May 21, 2015 at 20:47
1 Answer
Reset to default 5There seems to be a problem with the initialization of the carousel.
When you click for the first time on the arrow, it initializes the carousel which triggers the first switch AND select the next slide because you clicked on the arrow (all at the same time).
A direct fix would be to add this code to initialize the carousel on loading (which also enable the automatic sliding) :
$(function() {
$('#myCarousel').carousel();
});
Be sure to include this after the plugin and everything should be okay.
Update
It also appears to be jumping to the 3rd only without the transition effect.
As suggested by merv you could include the bootstrap-transition.js file and it will resolve your problem.
Anyway, I submitted a ticket, for those who wants some follow-up : Issue on github
本文标签： javascriptTwitter Bootstrap Carousel skipping issueStack Overflow
版权声明：本文标题：javascript - Twitter Bootstrap Carousel skipping issue - Stack Overflow 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://it.en369.cn/questions/1745647000a2161083.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论