jq同一页面内容切换
$(function() {
//选择标题显示
初始显示内容及样式
$('.right-content .right-item').eq(0).addClass('showcontent')
$('.left-content > li').eq(0).addClass('active')
点击时触发页面内容显示和active切换
$('.left-content > li').click(function(){
var index = $('.left-content > li').index(this)
$('.left-content > li').eq(index).addClass('active').siblings().removeClass('active');
$('.right-item').eq(index).addClass('showcontent').siblings().removeClass('showcontent');
})
})
jq同一页面内容切换的更多相关文章
- Axure 页面内多组内容切换的实现 + 利用一个内联框架实现百度地图访问
Axure 页面内多组内容切换的实现,场景:点击某个元件的时候,会显示响应的页面 操作:将显示的页面设置为动态面板,如图所示应该设置动态面板的状态为三个状态,分别为点击qq账号.手机账号.邮箱账号时 ...
- vue切换路由页面内容没有重载
项目中遇到这样一个问题: 在一个地方填了一个申请的表单,需要在另一个页面的列表上显示出来这条申请的数据,但是由于vue的缓存,在切换路由时列表上并没有及时更新数据,解决方法如下: vue路由切换时页面 ...
- 基于jQ+CSS3页面滚动内容元素动画特效
今天给大家分享一款基于jQ+CSS3页面滚动内容元素动画特效.这是一款基于jQuery+CSS3实现的页面滚动代码.该实例适用于适用浏览器:360.FireFox.Chrome.Safari.Oper ...
- Vue 路由切换时页面内容刷新页面并更新数据
第二次进入页面,页面路由参数已经改变,但是页面内容不会刷新 <keep-alive>是Vue的内置组件,能在组件切换过程中将状态保留在内存中,防止重复渲染DOM <keep-aliv ...
- jQuery实现页面导航内容定位效果,并支持内容切换
需求 页面向下滚动时,需要将顶部的搜索栏信息和导航菜单吸顶,并且,搜索栏信息和导航菜单之间可以切换. 效果 https://www.iguopin.com/index.php?m=&c=ind ...
- 使用ajax实现无刷新改变页面内容
如何使用ajax实现无刷新改变页面内容(也就是ajax异步请求刷新页面),下面通过一个小demo说明一下,前端页面代码如下所示 1 <%@ Page Language="C#" ...
- 简单实现弹出弹框页面背景半透明灰,弹框内容可滚动原页面内容不可滚动的效果(JQuery)
弹出弹框 效果展示 实现原理 html结构比较简单,即: <div>遮罩层 <div>弹框</div> </div> 先写覆盖显示窗口的遮罩层div.b ...
- Android开发之利用ViewPager实现页面的切换(仿微信、QQ)
这里利用ViewPager实现页面的滑动,下面直接上代码: 1.首先写一个Activity,然后将要滑动的Fragment镶嵌到写好的Activity中. Activity的布局文件:activity ...
- VC/Wince 实现仿Win8 Metro风格界面2——页面滑动切换(附效果图)
前几天开始写仿Win8 Metro界面文章,部分网友觉得不错,感谢各位的意见.本来今天一直在折腾Android VLC播放器,没时间写.不过明天休息,所以今天就抽时间先写一下. 言归正传,我们都知道W ...
随机推荐
- jlink之j-scope使用
网上看到了j-scope的用法,可以把单片机的数据显示成波形,这个和我使用的STMStudio有点类似,但是有区别: 1.STMStudio这个需要stlink结合swo的输出口,j-scope不需要 ...
- Can总线上的电平及物理层仲裁
CAN总线采用差分信号传输,通常情况下只需要两根信号线(CAN-H和CAN-L)就可以进行正常的通信.在干扰比较强的场合,还需要用到屏蔽地即CAN-G(主要功能是屏蔽干扰信号),CAN协议推荐用户使用 ...
- blockstack与Ethereum
https://github.com/blockstack https://bihu.com/article/1260288 blockstack是用户登录的认证中心,类似java中的OAuth2进行 ...
- 第03组 Alpha冲刺(4/4)
队名:不等式方程组 组长博客 作业博客 团队项目进度 组员一:张逸杰(组长) 过去两天完成的任务: 文字/口头描述: 制定了初步的项目计划,并开始学习一些推荐.搜索类算法 GitHub签入纪录: 暂无 ...
- Java程序设计学习知识点总结
Java程序设计学习知识点总结 Java语言简单,面向对象,分布式,解释性,健壮,安全与系统无关,可移植,高性能,多线程,动态语言. 什么是框架 可以认为是某种应用的半成品,就是一组组件用来完善自己的 ...
- 帝国cms替换iwms幻灯图片问题
在管理标签模板中增加一个新模板 页面模板内容为:[!--empirenews.listtemp--]<!--list.var1-->[!--empirenews.listtemp--] 列 ...
- ubuntu笔记2-误删dpkg的/var/lib/dpkg/info文件夹
由于误删了dpkg的/var/lib/dpkg/info文件夹,导致安装文件的时候报错 错误提示:E: Sub-process /usr/bin/dpkg returned an error code ...
- [技术博客]采用Qthread实现多线程连接等待
采用Qthread实现多线程连接等待 本组的安卓自动化测试软件中,在测试开始前需要进行连接设备的操作,如下图左侧的按钮 后端MonkeyRunner相关操作的程序中提供了connect() ...
- 自动创建Kibana索引
参考 https://www.cnblogs.com/dance-walter/p/10471950.html 参考 https://www.elastic.co/guide/en/kibana/cu ...
- Awesome Knowledge-Distillation
Awesome Knowledge-Distillation 2019-11-26 19:02:16 Source: https://github.com/FLHonker/Awesome-Knowl ...