html5
张高伟
人生最美的是相遇,最难得的是相逢!
展开
-
html5解决大文件断点续传
js代码[html] view plain copy > html> head> meta charset="UTF-8"/> title>xhr2title> head> body> div id="drop_area" style="border:3px dashed sil原创 2017-06-11 17:32:54 · 4661 阅读 · 0 评论 -
漂亮实用的提示框插件SweetAlert
SweetAlert可以替代Javascript原生的alert和confirm等函数呈现的弹出提示框,它将提示框进行了美化,并且允许自定义,支持设置提示框标题、提示类型、内容展示图片、确认取消按钮文本、点击后回调函数等。准备工作首先我们必须将SweetAlert插件的js文件和css文件引入到页面中。script src="sweetalert.min.js">script>原创 2017-07-11 19:26:24 · 402 阅读 · 0 评论 -
怎么让优酷视频在网页中自动播放方法
优酷视频在网页中自动播放:方法一1.首先在优酷复制得到欲贴视频的代码,2.复制出XMzExODY0NDQw贴入下面自动播放代码得到3.再用得到的自动播放代码贴入博客或者论坛就可以实现优酷视频的自动播放方法二1. 同方法一(1)得到欲贴视频的代码原创 2017-07-13 12:07:56 · 1829 阅读 · 0 评论 -
各大网站视频自动播放代码(优酷、搜狐、酷6、土豆等)
注:可以复制或涂蓝后同时按左下角CTRL+C即可复制。 如何将Flash素材保存到电脑硬盘? http://lxc66188.blog.163.com/blog/static/917649862011828104336146/一、优酷、搜狐视频自动播放代码(更换地址即可) 以下代码是《爱的供养》视频自动播放代码,将此代码复制粘贴到论坛博客上即可,原创 2017-07-13 12:13:07 · 2580 阅读 · 0 评论 -
关于本地存储localStorage
html lang="en">head> meta charset="UTF-8"> title>Titletitle>head>body> div style="border: 2px dashed #ccc;width:320px;text-align:center;"> label for="sitename">网站名(k原创 2017-07-26 16:06:22 · 218 阅读 · 0 评论 -
html 使表格随着内容自动适应宽度
所谓难而不会,会儿不难.这个问题让我纠结了很长时间,一句css解决了,仅仅靠一个属性[html] view plain copy td { white-space: nowrap; }原创 2017-08-13 15:17:25 · 987 阅读 · 0 评论 -
Html
Html代码 1)贴图:img src="图片地址"> 2)加入连接:a href="所要连接的相关地址">写上你想写的字a> 3)在新窗口打开连接:a href="相关地址" target="_blank">写上要写的字a> 消除连接的下划线在新窗口打开连接: a href="相关地址" style="text-decoration:none" target="原创 2017-07-10 17:27:26 · 301 阅读 · 1 评论 -
使用layer的iframe层提交表单后,需要关闭当前的iframe层,然后刷新父页面的方法
好久都没有用过layer了,最近要用layer来做一个报名页面,是这样的,现在有一个活动的列表页面,我需要点击每一个列表就弹出报名,然后通过ajax后台传值确认前台,如果报名成功则关闭这个iframe窗口,并且刷新列表页。下面是方法: // 这个是在iframe里面的js代码 var url = '/activity'; var frameindex= parent.lay原创 2017-07-10 17:25:46 · 461 阅读 · 0 评论 -
html5实现视频(放大缩小播放暂停)
效果如下图: html>body>meta charset="utf-8">div style="text-align:center;"> button onclick="playPause()">播放/暂停button> button onclick="makeBig()">大button> button onclick="makeNormal()">中b原创 2017-07-01 18:51:54 · 4275 阅读 · 0 评论 -
前端极限性能优化合集
前端极限性能优化合集性能优化是老生常谈了,从雅虎的N条军规,前端各种优化准则,到2010年Google IO上Steven 提出的高性能建站指南,都在告诉开发者,一个站点的性能非常重要,如何在有限的带宽条件下,达到极限的访问性能,如何让访问者,无论是从响应速度,视觉感官,操作流畅度都达到最佳体验,是目前Web技术上的一个至关重要的挑战.相较于前端, 后端的性能优化手段非常多。这原创 2017-06-10 11:57:36 · 23177 阅读 · 1 评论 -
bootstrap上传插件fileinput自动上传&成功回调
bootstrap上传插件fileinput功能非常强大,本文给出一例自动上传&上传成功回调的用例.核心就是调用 filebatchselected 文件选择完成事件实现的,文件上传成功的事件是 fileuploaded .<script> $("#update_cs...转载 2018-03-14 13:29:08 · 3048 阅读 · 0 评论 -
HTML图片热区map area的用法
<area>标记主要用于图像地图,通过该标记可以在图像地图中设定作用区域(又称为热点),这样当用户的鼠标移到指定的作用区域点击时,会自动链接到预先设定好的页面。其基本语法结构如下: <area class=type id=Value href=url alt=text shape=area-shape ...转载 2018-05-07 13:21:31 · 942 阅读 · 0 评论 -
vConsole ——开源的前端 console 调试面板
兄弟团队开发了一个针对手机网页的前端 console 调试面板,并将其开源了,一个非常有用的开发调试工具。 项目地址: https://github.com/WechatFE/vConsole 。不多介绍,以下内容直接 copy 了项目的 README.md 简介vConsole 是一个网页前端调试面板,专为手机 web 页面量身设计,帮助开发者更为便捷地进行开发调试工作。转载 2018-01-09 09:47:48 · 5308 阅读 · 0 评论 -
实现CKEDITOR图像浏览与上传
实现CKEDITOR图像浏览与上传作者:douyasi时间:2014年10月18日分类:PHPCKEditor 编辑器一款不错的互联网在线编辑器,但其图像上传功能,这里提供2个官方插件实现 CKEditor 的图像浏览与上传功能。Image Browsehttp://ckeditor.com/addon/imgbrowseImage Uploaderhttp://c原创 2017-08-18 09:33:18 · 364 阅读 · 0 评论 -
如何使用日历插件datepicker
演示地址:http://jqueryui.com/datepicker/下载地址:http://jqueryui.com/download/使用jQuery ui首先需要引入jquery类库,jQuery ui js脚本和jQuery ui css样式表。代码示例如下:script src="jquery-1.7.1.js">script> script src="jq原创 2017-08-23 16:24:30 · 806 阅读 · 0 评论 -
HTML5获取当前地理位置并在百度地图上展示的实例
1.HTML5获取当前地理位置HTML5 Geolocation API(地理位置应用程序接口)可以获取当前地理位置,手机端使用GPS,电脑则根据网络定位检查浏览器是否支持HTML5 Geolocation APIscript type="text/javascript">if(navigator.geolocation){ alert('浏览器支持GeoLocation!'转载 2017-12-08 10:19:45 · 2025 阅读 · 1 评论 -
利用自定义web-font实现数据防采集
web-font介绍web-font是CSS3中的一种标记 @font-face,在@font-face声明里,你可以声明一种字体,指定这种字体字体库文件从网络某个地址下载。具体写法如下:@font-face { font-family: '字体名称'; src: url('http://www.example.com/字体名称.eot'); /* IE9 Com转载 2017-12-08 10:20:14 · 363 阅读 · 0 评论 -
基于HTML5定位使用PHP+MySQL搜索附近的人并AJAX返回结果
前端HTML5 var gotrue = true; $(document).ready(function(){ loaddata(); }); setInterval(function() { loaddata(); gotrue = true; },10000); function loadda转载 2017-12-15 10:08:09 · 662 阅读 · 0 评论 -
HTML5元素拖拽drag与拖放drop相关API
其实HTML5就是新增一些有用的API 让我们更轻松的开发 从而把更多精力都放在业务逻辑上来 这些API的使用也非常简单 不过我的记性不太好 所以还是以博客的形式记录下来(手动滑稽) 今天就来写一下这个拖拽API默认拖拽说起拖放,其实最早实现拖放功能的还是IE(IE4) H5就是在IE实例的基础上指定的拖拽规范 在浏览器中,是有默认拖拽的 比如说图片的拖原创 2018-01-09 09:15:51 · 679 阅读 · 0 评论 -
cordova学习
1.两个系统的安装方式InstallationIn your command-line on Windows: c:\> npm install -g cordovaIn your terminal on Mac OS X/Linux: $sudo npm install -g cordova2.cordova -v 查看版本D:\phpSt原创 2018-01-09 13:30:13 · 1669 阅读 · 0 评论 -
htm5-FileReader接口
html>html lang="en">head> meta charset="UTF-8"> title>Titletitle>head>body> input id="myfile" type="file" name="file" multiple onchange="upload()"> div id="content">div>bo原创 2018-01-10 09:35:54 · 195 阅读 · 0 评论 -
HTML5触摸事件(touchstart、touchmove和touchend)
HTML5中新添加了很多事件,但是由于他们的兼容问题不是很理想,应用实战性不是太强,所以在这里基本省略,咱们只分享应用广泛兼容不错的事件,日后随着兼容情况提升以后再陆续添加分享。今天为大家介绍的事件主要是触摸事件:touchstart、touchmove和touchend。 一开始触摸事件touchstart、touchmove和touchend是iOs版Safari浏览器为了向开发人员原创 2018-01-11 10:34:16 · 344 阅读 · 0 评论 -
优惠券样式收集
<!DOCTYPE HTML><html><head> <meta charset="UTF-8" /> <title>CSS3优惠券</title></head><body><div class="demo-contai转载 2018-03-08 17:42:04 · 1513 阅读 · 0 评论 -
iframe 跨域访问session/cookie丢失问题解决方法
今天因工作需要,在一个域名A的页面中,使用iframe包含另一个域名B的页面。在chrome,firefox测试一切正常。当测试到IE7时,发现域名B中的页面session失效,不能写入session。网上搜索后了解, 因为IE有安全策略,限制页面不保存第三方cookie(当前访问域名A下的页面为第一方cookie,而域名B下的页面为第三方cookie)。虽然有安全策略转载 2017-12-07 09:41:17 · 3109 阅读 · 0 评论 -
深入理解BootStrap -- 标签(label)与徽章(badge)
1、标签在一些Web页面中常常会添加一个标签用来告诉用户一些额外的信息,比如说在导航上添加了一个新导航项,可能就会加一个“new”标签,来告诉用户。这是新添加的导航项。如下图所示:那么在Bootstrap框架中特意将这样的效果提取出来成为一个标签组件,并且以“.label”样式来实现高亮显示。既然他是一个独立的组件,当然在不同的版本下有不同的文件:☑ LES原创 2017-11-24 18:51:07 · 3563 阅读 · 0 评论 -
HTML5
html>html> head> meta charset="UTF-8"> title>Echarts加载测试title> head> body> div id="main" style="width: 900px; height: 500px;"> div>原创 2017-09-14 09:29:17 · 199 阅读 · 0 评论 -
弹
子页面用parent.data就可以获取 data = { data:"abc", a:this.itemActive }; layer.open({ type: 2, title: '选择师傅', area: ['900px','80%'], closeBtn: 1, conten原创 2017-09-15 09:38:20 · 196 阅读 · 0 评论 -
多个audio播放器播放,暂停,时间控制
标签可以在HTML5浏览器中播放音频文件。默认提供一个控制面板,但是有些时候我们只需要播放声音,控制面板由我们自己来定义其显示的状态。这里我使用jQuery来进行控制的代码如下:(!empty($val['voices'])){foreach($val['voices'] as $k=>$v){?> class="list-audio"> $v['title转载 2017-10-09 11:13:16 · 1425 阅读 · 0 评论 -
减少HTTP请求之将图片转成二进制并生成Base64编码,可以在网页中通过url查看图片(大型网站优化技术)
在网站开发过程中,对于页面的加载效率一般都想尽办法求快。那么,怎么让才能更快呢?减少页面请求是一个优化页面加载速度很好的方法。上一篇博文我们讲解了 “利用将小图标合成一张背景图来减少HTTP请求”,那么,这一篇博文将讲解 “ 将图片转成二进制并生成Base64编码,可以在网页中通过url查看图片”。 一、为何选择将图片转成二进制并生成Base64编码,可以在网页中通过url查看图片转载 2017-10-23 16:54:08 · 564 阅读 · 0 评论 -
减少HTTP请求之合并图片详解(大型网站优化技术)
一、相关知识讲解 看过雅虎的前端优化35条建议,都知道优化前端是有多么重要。页面的加载速度直接影响到用户的体验。80%的终端用户响应时间都花在了前端上,其中大部分时间都在下载页面上的各种组件:图片,样式表,脚本,Flash等等。 减少组件数必然能够减少页面提交的HTTP请求数。这是让页面更快的关键。减少页面组件数的一种方式是简化页面设计。但有没有一种方法可以在构建复杂的页面同时加快响应转载 2017-10-23 16:55:07 · 491 阅读 · 0 评论 -
基于H5的微信支付开发详解
这次总结一下用户在微信内打开网页时,可以调用微信支付完成下单功能的模块开发,也就是在微信内的H5页面通过jsApi接口实现支付功能。当然了,微信官网上的微信支付开发文档也讲解的很详细,并且有实现代码可供参考,有的朋友直接看文档就可以自己实现此支付接口的开发了。 一、前言 为何我还写一篇微信支付接口的博文呢?第一,我们必须知道,所谓的工作经验很多都是靠总结出来的,你只有总结了更多知识,积转载 2017-10-23 16:56:21 · 359 阅读 · 0 评论 -
分享几个好看的Bootstrap后台管理响应式模板
分享几个好看的Bootstrap后台管理响应式模板1/charisma演示地址国内下载地址:https://yunpan.cn/c6qrHAktZDddU (提取码:82fc)国外下载地址:https://codeload.github.com/almasaeed2010/AdminLTE/zip/v2.3.52/AdminLTE演示地址[转载 2017-11-21 16:04:57 · 2896 阅读 · 0 评论 -
微信WEB开发调试工具
为帮助开发者更方便、更安全地开发和调试基于微信的网页,我们推出了 web 开发者工具。它是一个桌面应用,通过模拟微信客户端的表现,使得开发者可以使用这个工具方便地在 PC 或者 Mac 上进行开发和调试工作。立即下载体验你可以: 使用自己的微信号来调试微信网页授权 调试、检验页面的 JS-SDK 相关功能与权限,模拟大部分 SDK 的输入和输出 使用基于 weinre 的移动调试功转载 2017-11-23 12:42:29 · 1265 阅读 · 0 评论 -
bootstrap 圆形按钮
<button type="button" class="btn btn-default btn-circle"><i class="glyphicon glyphicon-ok"></i></button><button type="button" class="btn btn-primary原创 2018-03-08 09:47:09 · 2697 阅读 · 0 评论