posts - 501,comments - 0,views - 23683

随笔分类 -  jQuery

1 2 3 下一页
学习尚硅谷相关课程做的笔记方便后续复习
LeetCode最长有效括号(/dp)
摘要:20230209 卡一下还是过了 20230218 dp记得初始化 20230220 顺利通过 20230308 顺利通过 原题解 题目 给你一个只包含 '(' 和 ')' 的字符串,找出最长有效(格式正确且连续)括号子串的长度。 约束 解法 解法一 class Solution { public: 阅读全文
posted @ 2023-02-05 21:48 垂序葎草 阅读(39) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(放大镜效果)
摘要:视频 //11. 当鼠标在中图上移动时, 显示对应大图的附近部分区域 function bigImg () { var $mediumImg = $('#mediumImg') var $mask = $('#mask')//小黄块 var $maskTop = $('#maskTop')//覆盖在 阅读全文
posted @ 2023-01-25 20:41 垂序葎草 阅读(78) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(切换显示中图)
摘要:视频 //10. 当鼠标悬停在某个小图上,在上方显示对应的中图 function midumImg() { $('#icon_list>li').hover(function () { //获取到 自己 src var src = $(this).children('img').attr('src' 阅读全文
posted @ 2023-01-25 19:36 垂序葎草 阅读(72) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(移动小图片)
摘要:视频 function moveMiniImg () { var $as = $('#preview>h1>a') var $backward = $as.first(); var $forward = $as.last(); var $Ul = $('#icon_list') var SHOW_C 阅读全文
posted @ 2023-01-25 19:05 垂序葎草 阅读(72) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(点击切换显示商品详情)
摘要:视频 //8. 商品详情的切换显示 function products() { $('#product_detail>ul>li').click(function () { $(this).siblings().removeClass('current') //兄弟姐妹去掉被选中的状态 $(this 阅读全文
posted @ 2023-01-25 17:56 垂序葎草 阅读(113) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(minicart显示隐藏)
摘要:视频 //7. 鼠标移入移出切换显示迷你购物车 function minicart() { $('#minicart').hover(function () { $(this).addClass('minicart').children('div').show() }, function () { 阅读全文
posted @ 2023-01-25 17:16 垂序葎草 阅读(41) 评论(0) 推荐(0) 编辑
jQuery复习(动画效果/插件机制/jQuery文档的结构图)
摘要:动画效果 在一定的时间内, 不断改变元素样式 slideDown()/slideUp()/slideToggle() fadeOut()/fadeIn()/fadeToggle() show()/hide()/toggle() animate({结束时的样式}, time, fun) stop() 阅读全文
posted @ 2023-01-25 17:02 垂序葎草 阅读(15) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(地址显示隐藏和切换/点击切换地址tab)
摘要:视频 地址显示隐藏和切换 点击切换地址tab //5. 鼠标移入移出切换地址的显示隐藏 function address() { $('#store_select').hover(function () { $('#store_content, #store_close').show() }, fu 阅读全文
posted @ 2023-01-22 18:30 垂序葎草 阅读(100) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(点击显示或者隐藏更多的分享图标)
摘要:视频 下标从下往上找的prevAll //4. 点击显示或者隐藏更多的分享图标 function share() { var isClose = true $('#shareMore').click(function () { if (isClose) { //当前关闭==>打开 $('#dd'). 阅读全文
posted @ 2023-01-22 18:09 垂序葎草 阅读(79) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(搜索框功能)
摘要:视频 获取焦点并且输入后显示,失去焦点隐藏。 事件回调函数的this是dom元素,和如何添加监听没有关系。 //3. 输入搜索关键字, 列表显示匹配的结果 function search() { // 1.写入数据的时候,出现智能提示 // 2.失去焦点的时候,隐藏智能提示 // 3.当输入框中有数 阅读全文
posted @ 2023-01-22 17:50 垂序葎草 阅读(59) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(二级菜单的显示隐藏)
摘要:视频 //2. 鼠标移动切换二级导航菜单的切换显示和隐藏 /* 1.对哪个/些元素绑定什么监听? 2.对哪个/些元素进行什么DOM操作? */ function subMenu() { $('#category_items .cate_item').hover(function () { $(thi 阅读全文
posted @ 2023-01-22 17:35 垂序葎草 阅读(67) 评论(0) 推荐(0) 编辑
jQuery练习4京东商品详情页面(显示隐藏)
摘要:视频 真正难的是设计阶段阶段。 //1. 鼠标移入显示,移出隐藏 /* 1.对哪个/些元素绑定什么监听? 2.对哪个/些元素进行什么DOM操作? */ function showHide() { $('[name=show_hide]').hover(function () { var id = $ 阅读全文
posted @ 2023-01-22 17:18 垂序葎草 阅读(93) 评论(0) 推荐(0) 编辑
jQuery插件(jQuery-UI(Accordion:手风琴/Autocomplete:自动搜索匹配/Tabs:选项卡))
摘要:视频 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>测试jQuery-UI的基本使用</title> <link rel="stylesheet" href="jquery-ui.css"> </head> 阅读全文
posted @ 2023-01-18 03:28 垂序葎草 阅读(23) 评论(0) 推荐(0) 编辑
jQuery插件(jQuery validation表单插件)
摘要:视频 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .error { color: #F00; } </style> </head> <body> <!-- re 阅读全文
posted @ 2023-01-18 02:04 垂序葎草 阅读(37) 评论(0) 推荐(0) 编辑
jQuery(window.onload与$(document).ready())
摘要:视频 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>window.onload与$(document).ready()</title> </head> <body> <h1>测试window.onload与 阅读全文
posted @ 2023-01-17 19:47 垂序葎草 阅读(18) 评论(0) 推荐(0) 编辑
jQuery多库共存
摘要:视频 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>26_多库共存</title> <style type="text/css"> * { margin: 0px; } .div1 { position: absolute; 阅读全文
posted @ 2023-01-17 19:37 垂序葎草 阅读(13) 评论(0) 推荐(0) 编辑
jQuery(自定义动画/导航动态显示效果)
摘要:视频 自定义动画 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>24_自定义动画</title> <style type="text/css"> * { margin: 0px; } .div1 { position: abs 阅读全文
posted @ 2023-01-17 18:45 垂序葎草 阅读(101) 评论(0) 推荐(0) 编辑
jQuery内置动画效果(淡入淡出/滑动收索展开/显示与隐藏)
摘要:视频 淡入淡出 fadeOut: 改变opacity 1 -> 0 最后把 display设置为none。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>21_淡入淡出</title> </head> <style type= 阅读全文
posted @ 2023-01-16 03:09 垂序葎草 阅读(416) 评论(0) 推荐(0) 编辑
jQuery练习3轮播图(点击圆点翻页/解决快速点击翻页的bug)
摘要:视频 点击圆点翻页 实现nextPage传数值的应用:修改对应offset就行 upDatePoints里面更新 解决快速点击翻页的bug nextPage修改moving初始值为0 一进nextPage就执行,并且变化moving为1 删除定时器的时候变化moving为0 最终代码jQuery h 阅读全文
posted @ 2023-01-16 02:39 垂序葎草 阅读(155) 评论(0) 推荐(0) 编辑
jQuery练习3轮播图(平滑翻页/循环翻页/自动翻页(鼠标移入停止)/圆点同步更新)
摘要:视频 平滑翻页 没写动画效果的时候 平滑的翻页 循环翻页 图片需要在第一张前面加上最后一张,在最后一张后面加上第一张。 改变格式让第一张显示出来。 自动翻页 鼠标事件 圆点同步更新 阅读全文
posted @ 2023-01-15 01:34 垂序葎草 阅读(41) 评论(0) 推荐(0) 编辑

1 2 3 下一页
< 2025年2月 >
26 27 28 29 30 31 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 1
2 3 4 5 6 7 8

点击右上角即可分享
微信分享提示