JavaScript 判断滚动条是否滚动到最底部

<!DOCTYPE html><head><meta charset="utf-8"><meta name="renderer" content="webkit"><title>js判断滚动条是否到底部</title><style>    .bottom{...

  • 0
  • 0
  • admin
  • 发布于 2020-06-26 16:42
  • 阅读 ( 286 )

判断手机是竖屏还是横屏状态

<script>    // 判断横屏展示时的状态    window.onorientatiοnchange=function(){        if(window.orientation==90||window.orientation==-90){            window.location.reload();...

  • 0
  • 0
  • admin
  • 发布于 2020-06-26 16:38
  • 阅读 ( 313 )

CSS改变input输入框闪烁光标的颜色

第一种 <!doctype html><html lang="en"><head><meta charset="UTF-8"><title>改变输入框光标颜色</title><style>input {    color: #333;    care...

  • 0
  • 0
  • admin
  • 发布于 2020-06-26 14:37
  • 阅读 ( 286 )

全屏描点切换效果,可点击,可滚动

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> &lt...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:42
  • 阅读 ( 288 )

页面文字选中状态下改变背景与字体颜色

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>文字选中添加背景色改变字体颜色--三角号</title> <style> div::sel...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:38
  • 阅读 ( 265 )

JS左划出现删除按钮,右滑隐藏的完整案例

<!doctype html> <html> <head> <meta charset="utf-8"> <title>左划出现删除按钮,右滑隐藏</title> <script src="http://libs.baidu.com/jquery/1....

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:34
  • 阅读 ( 307 )

CSS有趣案例-跳动的心

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>跳动的心</title> </head> <style type="text/css"> * { m...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:26
  • 阅读 ( 290 )

网页禁止鼠标右键点击,禁止复制,禁止拖动图片

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>禁止右键,禁止复制,禁止拖动图片</title> </head> <!-- oncontext...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:21
  • 阅读 ( 258 )

解决ios苹果手机输入法弹框遮挡输入框

// 解决输入法遮挡----一般是 ios上 var timer = null; $(’.input’).on(‘focus’, function() { clearInterval(timer); var index = 0; timer = setInterval(function() { if(index>5) { $(‘b...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:19
  • 阅读 ( 288 )

input输入框内禁止输入空格

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>禁止输入空格键</title> <script src="http://libs.baidu.com/jquery/...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:15
  • 阅读 ( 293 )

Javascript清除input输入框内的空格

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>清除输入框内的空格</title> </head> <body> <input type="t...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:14
  • 阅读 ( 285 )

H5移动端Javascript拖拽效果案例

<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"> <title&gt...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:11
  • 阅读 ( 275 )

Javascript下拉刷新效果

<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"> <title&gt...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:06
  • 阅读 ( 299 )

CSS滤镜设置图片变亮效果

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>图片变亮效果--滤镜</title> <style> .div{ width: 200px; }...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 23:02
  • 阅读 ( 310 )

文字、图片左右无缝滚动效果--支持拖拽

<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8"> <title>文字、图片无缝滚动效果--广告</title> <st...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 22:09
  • 阅读 ( 273 )

js随机漂浮的广告图片效果代码

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js随机飘动的广告图片代...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 22:05
  • 阅读 ( 281 )

设计稿750px移动端自适应,100px=1rem的设置方法

var kk=document.documentElement.clientWidth; if(kk>750){ kk=750 }document.documentElement.style.fontSize=kk/7.5+"px"

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 22:01
  • 阅读 ( 286 )

JS实现点击收缩,点击展开效果

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>点击收缩,点击展开</title> <script src="http://libs.baidu.com/jq...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 21:57
  • 阅读 ( 326 )

页面实现加载进度条的效果

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>进度条</title>    <style>        *{            margin: 0;     ...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 21:55
  • 阅读 ( 286 )

textarea输入框限制输入字符的方法

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>textarea限制输入字符</title> </head> <body> <textarea...

  • 0
  • 0
  • admin
  • 发布于 2020-06-25 21:52
  • 阅读 ( 260 )