Web前端
黑狗向前跑
拒绝摆烂 好好加油
展开
-
Web前端_for循环绑定事件i丢失问题
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>for循环绑定事件i丢失问题</title></head><body> <ul> <li>111</li> <li>222</li> <原创 2021-09-07 11:07:34 · 150 阅读 · 0 评论 -
Web前端_轮播图的实现
<!DOCTYPE html><html><meta charset="utf-8"><head> <title>轮播图1</title> <style type="text/css"> ul{ list-style: none; } .imgs{ width:590px; height:470px; overflow: hidden; } .dots{ width原创 2021-09-07 10:31:11 · 2309 阅读 · 1 评论 -
Web前端_JS_获取当前时间封装的函数
function time(){ var date = new Date(); //创建日期对象 var year = date.getFullYear(); //年 var month = date.getMonth() + 1; //月 var day = date.getDate(); //日 var hour = date.getHours(); //时 var min = date.getMinutes(); //分 var seconds原创 2021-09-02 09:23:00 · 400 阅读 · 0 评论 -
Web前端_JS_生成a到b范围内的随机数
//生成范围a-b内的随机数 包括bfunction suijishu(a,b){ return Math.floor(Math.random() * (a-b))+b+1;};//使用方法console.log(suijishu(100,200));原创 2021-09-01 17:09:50 · 730 阅读 · 0 评论 -
Web前端_自己封装的Ajax对象
ajax.js 代码如下:(function(){ var ajax = { getxhr:function(){ return new XMLHttpRequest(); }, get:function(path,sync = true,fun){ var xhr = this.getxhr(); xhr.onreadystatechange = function(){原创 2020-09-16 14:35:50 · 203 阅读 · 0 评论 -
Web前端_如何清除微信内置浏览器的缓存
先点击这个链接 升级下浏览器的内核:debugmm.qq.com/?forcex5=true在点击这个链接 :http://debugtbs.qq.com进入页面后,滑到最左下角 有个 "DebugX5" 的图标点击 "DebugX5" 进入调试页面滑到最下面把 "Cookie" "文件缓存" "广告过滤缓存" "DNS缓存" 选中然后点击 "清除"按钮 ...原创 2019-08-28 13:56:25 · 1961 阅读 · 0 评论 -
Web前端_使用Swiper插件实现上下滑动展示图(包括移动端)
Swiper插件官网下载地址:https://www.swiper.com.cn/html示例代码:<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <title>Swiper demo</title> <meta name...原创 2019-08-27 23:59:45 · 3368 阅读 · 2 评论 -
Web前端_配合swiper滑动插件实现同比例双指缩放图片
参考过的一篇文章:https://blog.csdn.net/gl0ry/article/details/56055414html实例代码:缩放的图片需要放在class 为list 的div里面<!doctype html><html><head> <meta http-equiv="Content-Type" co...原创 2019-08-12 17:11:57 · 1934 阅读 · 1 评论 -
第一章-响应式布局(bootstrap框架)
大家好,由于我现在还在学习,有什么不对,希望大家帮忙指点,能和像我一样的大白共同进步,以下是我在学习中的一些实例项目和总结。实现弹性布局方法一般我们习惯设置宽高,大小用像素(px)来做作为单位,其实还一种单位(百分比),列如:.box{width:100%; //常常我们习惯写成 width:960px;height:50%;border: 1px solid ...原创 2018-07-01 14:39:05 · 1184 阅读 · 1 评论 -
Web_制作页面开场动画并解决自动播放问题
实例代码:<!-- 用一个div容器 来包裹视频 --> <div id="myVideo" style="position:absolute;z-index:9999;width:100%; height:100%;"> <video onclick="play();" muted="muted" id="videoplay" autoplay=...原创 2019-08-05 14:02:58 · 1766 阅读 · 0 评论 -
Web_使用pinchzoom插件实现图片手势缩放
插件下载地址:https://www.lanrenzhijia.com/js/css3/3253.htmlpinchzoom.js插件代码:/* Copyright (c) Manuel Stofer 2013 - rtp.ch - RTP.PinchZoom.js Permission is hereby granted, free of charge, to...原创 2019-08-05 15:14:30 · 4109 阅读 · 0 评论 -
Web_Html页面在手机端出现右边空白(转载)
原文地址:https://blog.csdn.net/LIU_YANZHAO/article/details/53543942原创 2019-08-05 15:15:54 · 631 阅读 · 0 评论 -
Web_禁止移动端页面拖拽(拖动)
在页面head里加上: <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, viewport-fit=cover" /> <meta name="apple-mobile-web-app-capable" co...原创 2019-08-08 08:43:15 · 3580 阅读 · 0 评论 -
Web_实现等待页面加载完毕才进入页面
实例代码: <script type="text/javascript"> document.onreadystatechange=function(){ //是否加载完毕 if(document.readyState =='complete'){ // $('.out').fadeOut(); //加载完成 隐藏加载图...原创 2019-08-06 11:37:04 · 874 阅读 · 0 评论 -
Web_js如何判断是pc端还是移动端
实例代码如下: <script type="text/javascript"> function browserRedirect() { var sUserAgent = navigator.userAgent.toLowerCase(); var bIsIpad = sUserAgent.match(/...原创 2019-08-14 10:52:17 · 759 阅读 · 0 评论 -
Web前端_实现html页面加载进度条(转载)
原文地址:https://blog.csdn.net/lmj623565791/article/details/34825865html实例代码如下:<div class="out" style="background-image: url(../img/bg.png); z-index: 999; position: fixed; width: 100%; height: 100...原创 2019-08-09 20:15:15 · 5947 阅读 · 0 评论 -
Web_html十六进制透明颜色码
透明颜色: #00FFFFFF英文代码 形像颜色 HEX格式 RGB格式 LightPink 浅粉色 #FFB6C1 255,182,193 Pink 粉红 #FFC0CB 255,192,203 ...原创 2019-08-15 13:39:50 · 4088 阅读 · 0 评论 -
Web前端_js计算一个数组的最大值和最小值还有和提取成方法调用
实例代码如下: <script type="text/javascript" language="JavaScript"> /** * @param {Object} array 求一个数组的最大值和最小值还有和 * */ function getArrayMaxAndMinAndHe(array){ var max = array[0...原创 2019-08-15 16:27:35 · 927 阅读 · 2 评论 -
Web前端_ 使用Swiper插件实现_上下滑动图片滚动展示效果
1.下载Swiper插件下载地址:https://www.swiper.com.cn/实例代码如下:<!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta n...原创 2019-07-11 11:55:11 · 4805 阅读 · 0 评论