jquery
关注
分享
扫一扫
文章平均质量分 70
luoyu6
个人生活和学习笔记
展开
-
JQuery中的text(),html()和val()区别
text()定义和用法text() 方法方法设置或返回被选元素的文本内容，如果有子标签，则把子标签内的文本一起返回，相当于js的innerText代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="v转载 2018-10-30 15:09:40 · 4398 阅读 · 1 评论 -
js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
js jquery 获取元素(父节点,子节点,兄弟节点)一,js 获取元素(父节点,子节点,兄弟节点) var test = document.getElementById("test"); var parent = test.parentNode; // 父节点 var parent = test.parentNode.parentNode; // 父节点的父...转载 2018-10-26 18:45:02 · 295 阅读 · 0 评论 -
jQuery实现购物车商品数量及总价的计算
记录一下项目中遇到的计算购物车商品数量和总价的jQuery代码，重点在于选择器以及.text()命令的使用。先上效果图，点击加减，商品数量以及总价会发生相应变化。html代码： <div class="addGoods"> <div class="goods_list"> <ul> ...转载 2018-10-28 17:07:45 · 10312 阅读 · 1 评论 -
基于jQuey的tab切换,qq音乐播放器
tab切换很常见了，基本就是两种情况1：点击不同的的tab选项，选项对应的内容改变css样式(或者js),2：不断点击当前按钮，选项对应的内容改变css样式(或者js),基于这个原理，我们来做个tab切换，两个情况都包含有的，就拿QQ音乐来说吧点击不同的单曲，会自播放 ，不断点击当前歌曲，会播放暂停切换，我们要完成的就是这个事情那怎么搞呢，我们可以给歌曲列表设置一个变量b啊...原创 2018-10-22 18:08:10 · 318 阅读 · 0 评论 -
在小屏幕和手机屏幕下，Bootstrap汉堡导航的自动折叠隐藏
最近在使用Bootstrap框架做网页时发现，在小屏幕和手机屏幕之下（max-width: 768px），导航栏不能在点击导航链接时，自动折叠导航栏。或者在展开导航栏后，如果不点击其中的导航链接，用户在选择滑动屏幕时，不能做到自动折叠导航栏。需要用户手动点击折叠按钮，才能收回去。这在小屏幕宝贵的显示面积内，显然不合理，用户体验也不好。解决办法：//点击导航之后隐藏 $(w...原创 2018-10-14 23:33:33 · 2786 阅读 · 0 评论 -
解决锚点链接跳转后位置上下偏移的偏移的办法
应用场景：我们把导航固定在页面顶部的时候，点击锚链接跳转到相应的部分时，很可能导航把页面的内容覆盖了，像这样导航把文字覆盖了， 原因就是我们设置了padding这类css属性 正常盒模型的宽度：width=width+padding+border,其实就是导航盖住了盒模型的padding，覆盖原因就不过多解释了。我们还是说下解决办法吧问题：既然是锚链接，要跳转，就要用href呀，同时，...原创 2018-10-05 23:08:01 · 15811 阅读 · 12 评论 -
jQuery实现qq音乐播放器项目-ajax跨域使用
页面是pc端的页面主页index.html包含了音乐播放暂停，上一首下一首切换，拖动进度条改变播放位置，删除当前音乐，歌词联动变色等功能，数据是本地的json格式的文件点击此处页面效果search_music.html,点击主页的logo跳转过去，输入搜索的关键词，就可以看到歌词信息，播放歌曲。调用的是QQ音乐的数据，虽然包含了搜索音乐，播放音乐，显示搜索历史，歌词变色的功能，但是界面...原创 2018-09-26 13:08:08 · 1798 阅读 · 1 评论 -
jquery瀑布流js瀑布流
瀑布流的演示地址https://luoyu6.github.io/waterfall/index.html源码下载地址https://github.com/luoyu6/waterfall 其中js文件保存着图片的信息，是简单的json格式的数据，此处不粘贴了，小伙伴需要的可以去下载来看一下以下是html文件：<!DOCTYPE html><html> ...原创 2018-09-09 00:50:21 · 685 阅读 · 0 评论 -
淘宝无缝滚动轮播图jQuery，京东无缝滚动轮播图jQuery
前面我有篇笔记是小米淡入淡出轮播图的，现在顺手附上淘宝首页的无缝滚动轮播图，这是源码地址 https://github.com/luoyu6/slideshow_taobao暂时没有效果图，劳烦大家去下载源码自己看一下了，这个轮播图细节处理的还是比较好的，点击很快的时候，也不会出现空白的情况代码在这里：<!DOCTYPE HTML><html> &l...原创 2018-09-09 00:29:07 · 1157 阅读 · 0 评论 -
jQuery轮播图淡入淡出，小米官网轮播图
和小米官网轮播图是一样的效果，需要的小伙伴拿走不谢，附上源码下载链接https://github.com/luoyu6/slideshow_xiaomi注意：写的时候唯一需要的就是布局的时候li元素 需要设置成 position: absolute;不然轮播的时候有一段时间出现空白！以下是效果图（没有动图，只有效果图，凑合看吧 尴尬~~）代码如下<!DOCTYPE HT...原创 2018-09-09 00:20:52 · 914 阅读 · 0 评论 -
jQuery实现加入购物车飞入动画效果之开发不停，填坑不止（起点位置在Y轴方向位置偏移）
开发时为了完成购物车的飞入抛物线，因为懒惰随大流使用了fly.js插件，用的时候遇到的两个坑坑~~1. 有滚动条时，抛物体的起点位置在Y轴方向上有位置偏移，偏大2. 页面有滚动条时，抛物体的结束位置不一样，偏大我：(⊙o⊙)…烦烦的。。。这就是用别人东西的代价 。。。。。。不管如何先来解决第一个坑吧实现加入购物车效果，正常我们是这样使用的（第一次用的话，点击这里查看官方使用说明...原创 2018-10-30 21:44:22 · 2592 阅读 · 4 评论