专栏首页前端之攻略带左右箭头切换div的js 原

带左右箭头切换div的js 原

var index = 0;
var preText = '';
var nextText = '';
$(function(){
 $('.pretext1').text('无');
 $('.nexttext1').text($('.bannerul>li').eq(index+1).find('.zhankong-title').text());
 $('.pre').click(function(){
  if(index == 0) return;
  index--;
  SetHeadTitle(index);

  SetLiVisible(index);
 });
 $('.next').click(function(){
  debugger;
  if(index == $('.bannerul>li').length-1) return;
  index++;
  SetHeadTitle(index);

  SetLiVisible(index);
 });
})
function SetHeadTitle(index)
{
 if(index ==0)
  {
   preText = '无';
   nextText = $('.bannerul>li').eq(index+1).find('.zhankong-title').text();
  }
  else if(index == $('.bannerul>li').length-1)
  {
   preText = $('.bannerul>li').eq(index-1).find('.zhankong-title').text();
   nextText = '无';
  }
  else
  {
   preText = $('.bannerul>li').eq(index-1).find('.zhankong-title').text();
   nextText = $('.bannerul>li').eq(index+1).find('.zhankong-title').text();
  }
  $('.pretext1').text(preText);
  $('.nexttext1').text(nextText);
}
function SetLiVisible(index)
{
 $('.bannerul>li').each(function(i,item){
   $(this).removeClass('bannerliYes');
   $(this).addClass('bannerliNo');
  });
  $('.bannerul>li').eq(index).removeClass('bannerliNo');
  $('.bannerul>li').eq(index).addClass('bannerliYes');
}

(adsbygoogle = window.adsbygoogle || []).push({});

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 开关门js 转

    (adsbygoogle = window.adsbygoogle || []).push({});

    tianyawhl
  • 数组或对象中的内容间隔显示

    总结:间隔显示,不要使用for 循环,原因是for循环是同步,setTimeout是异步,同步执行完再执行异步。

    tianyawhl
  • ps 切图方法避免手机显示有锯齿 原

    在工作中所做的web页面使用电脑,手机和平板,发现在切图时候,如果图片切的比较大,在平板上会有明显的锯齿,经过多次试验发现,如果样式中图片的大小为100px*1...

    tianyawhl
  • Python_二维数组

    py3study
  • Apache2为什么会自动加载index.php

    我直接输入域名后,Apache2自动加载了对应目录下的index.php, 这是怎么做到的?

    Jerry Wang
  • nginx 配置目录转发

    server { listen 80; autoindex off; server_name image.imooc.com; ...

    Dar_Alpha
  • 【每天一道编程系列-2018.2.20】(Ans)

      The string “PAYPALISHIRING” is written in a zigzag pattern on a given number ...

    yesr
  • 【AlexeyAB DarkNet框架解析】七,YOLOV1损失函数代码详解(detection_layer.c)

    灵魂拷问,你真的懂YOLOV1的损失函数吗?进一步,懂了损失函数,你清楚它的反向求导过程吗?为了解决这俩问题,本文就结合DarkNet中的YOLOV1的损失函数...

    BBuf
  • 轮播(未完待续)

    天天_哥
  • 浅析一个sql server数据库事务死锁问题

    一个学生管理系统,数据库是sql server,有一个Web API用于创建student。student对象的表结构如下:

    Bruce Li

扫码关注云+社区

领取腾讯云代金券