js实现适合新闻类图片的轮播效果
本文主要分享了js实现适合新闻类图片轮播效果的示例代码，具有一定的参考价值，下面跟着小编一起来看下吧
var carousel_interval_id, //interval ID
start_carousel_flag = false, //是否开始interval
carousel_speed = 50, //滚动速度（px/s）,carousel_speed=1000/interval时间间隔。
start_interval = function() { //执行interval
start_carousel_flag = true;
carousel_interval_id = setInterval(function() {
var margin_left = $('.carousel-area').css('margin-left');
$('.carousel-area').css('margin-left', (parseInt(margin_left) - 1) + 'px'); //不断左移1px
if (parseInt($('.carousel-area').css('margin-left')) = -($('.carousel-ul').width())) { //轮播部分超出容器后复位
$('.carousel-area').css('margin-left', 0);
}, 1000 / carousel_speed)
end_interval = function() { //停止interval
start_carousel_flag = false;
carousel_interval_id = clearInterval(carousel_interval_id);
$('.() + ' /ul //复制carousel-ul，填补左移后出现的无内容区域，以此完成循环
start_interval();
$('.carousel-area').hover(
function() { //鼠标悬停事件
if (start_carousel_flag) { //已经开始interval
end_interval();
function() { //鼠标离开事件
if (!start_carousel_flag) { //没有开始interval
start_interval();
/script
/body
/html
以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持凡科！
