html
文章平均质量分 65
离恢
web前端吊车尾
展开
-
图片点击放大,带上一张下一张按钮
前言 之前写过单纯的图片点击放大的效果,这次完善了一下,加上了左右切换上一张下一张按钮 一、先上代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>点击图片放大</title> <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></scrip原创 2021-01-30 13:51:16 · 929 阅读 · 0 评论 -
使用canvas画太极图,可自适应大小
canvas实现太极图 效果图 思路 用arc() 方法画圆或者半圆,圆的起始角度为0,结束角度是2Math.PI, Math.PI=3.14=180度, 可以让Math.PI/180度数获得想要的角度 用法就是这样 context.arc(x,y,r,sAngle,eAngle,counterclockwise); 详细参数解释可以去菜鸟教程看 https://www.runoob.com/tags/canvas-arc.html 自适应大小是通过获取canvas外层的div的宽度来的,让外层div 宽原创 2020-12-22 11:11:11 · 413 阅读 · 0 评论 -
js实现网页飘窗
前言 js写的网页飘窗,让元素一直在屏幕来回飘动,鼠标经过的时候停止运动.思路 通过fixed定位设置元素位置,然后通过 (元素宽高) 与 (left/top值) 与 (移动像素) 这三个的和相加得到的结果和屏幕宽高相比较,这样来判断移动方向.最后用onmouseover和onmouseout来实现鼠标经过的时候停止动画,鼠标离开继续动画 先上代码 代码如下(示例): <!DOCTYPE html> <html> <head> <meta charset=.原创 2020-12-12 11:19:47 · 5719 阅读 · 1 评论 -
js制作简单的日历
前言 自己闲暇时用js写了一个比较简单的日历, 给大家分享下 一、下面是完整代码 代码如下(示例): <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>日历</title> <style原创 2020-12-10 11:51:40 · 5857 阅读 · 0 评论 -
很简单的jq点击放大图片的效果
前言 很简单的点击放大图片的效果,代码都有注释,一看就懂 一、先上代码 <html> <head> <title>图片放大</title> <script src="jquery.min.js" type="text/javascript" charset="utf-8"></script> <style type="text/css"> body,html{margin:0;padding:0;bac.原创 2020-12-10 11:39:09 · 793 阅读 · 0 评论 -
jq超级简单的回到顶部效果
前言 很简单的用jq实现回到顶部的效果,其实还有其他的办法实现回到顶部效果,但是个人觉得这个比较好用 1.使用前别忘了引入jq,先看代码 代码如下(示例): <html> <head> <title>回到顶部</title> <script src="jquery.min.js" type="text/javascript" charset="utf-8"></script> <style type="text/.原创 2020-12-10 11:20:48 · 501 阅读 · 0 评论