小程序
砂糖小刀j
开始吧!
展开
-
页面滑入控制显示隐藏
实现根据页面滚动到指定位置让相应位置的元素显示与隐藏CSS部分 * { margin: 0; padding: 0; } .display-box { margin: 1000px auto 500px; width: 800px; height: 300px; position: relative;原创 2021-05-25 09:24:38 · 214 阅读 · 0 评论 -
网页图片放大镜
基本思路:大图片盒子包裹大图片,小图片盒子包裹小图片,遮盖层位于小图片盒子里,用鼠标的移动事件,让遮盖层跟随鼠标移动,移动遮盖层的同时让大图片跟着移动相应比例的距离,注意大图片移动的方向和遮盖层的方向相反,难点为获取相应距离1.html代码<body> <div class="container"> <div class="smallbox"> <img src="./images/small.jpg" class原创 2021-05-17 19:06:38 · 264 阅读 · 0 评论 -
旋转立方体小程序
基本思路:立方体由六个div拼接而成,大盒子中的六个div分别代表立方体六个面(使用css3过渡属性调整方向和位置),最后使用css3动画属性将大盒子进行旋转即可第一步,在html中进行基本布局 <div class="box"> <div class="top"><img src="./images/1.jpg"></div> <div class="bottom"><img src="./images/原创 2021-05-16 14:52:23 · 325 阅读 · 0 评论