页面域关系： 主页面a.html所属域A：www.gxlcms.com 被iframe的页面b.html所属域B：www.jb51.cn,假设地址：http://www.jb51.cn/b.html 实现效果： A域名下的页面a.html中通过iframe嵌入B域名下的页面b.html,由于b.html的宽度和高度是不可预知而且会变化的,所以需要a.html中的iframe自适应大小. 问题本质: js对跨域iframe访问问题,因为要控制a.html中iframe的高度和宽度就必须首先读取得到b.html的大小,A、B不属于同一个域,浏览器为...
一般我们用表格的时候总会给它个border属性，比如：<table border="1">，其效果如下：IDNAMEGENDER1001mikemale 可以发现表格的边框好像很宽，当然这里的“很宽”绝对不是表格border的宽，大家看到的宽应该是<td>之间有间隙所致。因此只需要修改表格的cellspacing属性即可，即：<table border="1px" cellspacing="0px">，效果如下：IDNAMEGENDER1001mikemale 但是，好像宽度还是没有我们想象的那样：只有一个像素的宽，其实，上图大...
闲来无事，突然又想起了圆角矩形的实现。不过这个话题大家已经谈了太长时间了。各种各样的实现方案在网上都可以看到。这里仅仅是记录一下个人认为比较好的一个。这个方案不使用任何图片，是纯html+css实现。 css代码================================== 代码如下: <style type="text/css"> .spiffy{display:block} .spiffy *{ display:block; height:1px; font-size:.01em; overflow:hidden; background:#b20000} .spiffy1{ margin...
事件响应刷新：有请求才会刷新 1、通过JS HTML DOM或jQuery获取HTML元素，通过DOM方法或jQuery方法监听页面事件，获取用户请求； 2、通过Ajax将用户请求提交至服务器，服务器处理后返回结果，再由Ajax接收数据； 3、通过DOM方法或jQuery方法将数据载入页面，事件响应刷新完成。$('#input_date').keypress(function(e){if(e.keyCode=='13'){$.ajax({type: "POST",url: "inquire_date.php",data: {birth:null,//1.获取用户请求（即某...
本篇文章给大家带来的内容是关于html5中Canvas屏保动画的实现代码，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。话不多说直接上代码<!DOCTYPE html> <html> <head><meta charset="UTF-8"><title>Title</title></head><body style="height:760px"><canvas id="canvas" style="border:0px red solid;display:none"></canvas></body></html>因为项目需求，该动画中需要显示即时更新的数据，所以和普通的canvas画出...
这篇文章主要介绍了HTML5、Select下拉框右边加图标的实现代码，深度美化页面增进用户体验效果,需要的朋友可以参考下本文给大家讲h5、select下拉框右边加图标，深度美化页面增进用户体验效果1.那么我们先来看一下效果吧！ 2.再看看h5的结构：<p id="login-p"><p class="select-wrapper"><select id="selector1"><option value="" disabled selected>请选择系统：</option><option value="1">微信-苹果</option><option value="2"...
昨天是三八女神节，本文主要和大家分享html5开发表白神器实现代码，大家也可以在这一天用来表白哦。开发三八女王节表白神器运用到的知识点：css33D场景、3D变换、爱心制作技巧、3D立方体制作技巧、自定义动画，原生js DOM节点操作、循环等。效果图如下所示： :point_down:html代码：<p id="display"></p><p class=heart3d><p class=rib1></p><p class=rib2></p><p class=rib3></p><p class=rib4></p><p class=rib5></p><p class=r...
HTML5中的script属性： script 标签在HTML5中除了具备HTML5新标准定义的属性以外，和HTML4.01相比移除了language属性，修改了type属性为可选的（默认text/javascript），并新增了一个属性async。 async :boolean, 属性的作用，定义脚本是否异步执行，取值true或false。 如果 async 设为 true ，会忽略 defer 属性。 异步执行的 js 文件被假定为不使用 document.write() 向加载中的 document 写入内容，因此不要在 异步执行的 js 文...
html5自定义遮罩的实现代码分享ys_loading.css.ys-loading{position:fixed;top:0;bottom:0;left:0;right:0;z-index: 9999; }.ys-loading em{position:absolute;left:0;right:0;top:0;bottom:0;width:44px;height:44px;margin:auto;border-radius: 22px;opacity: 0.3;overflow: hidden; }.ys-loading em:before{content:"";display:block;width:46px;height:46px;background:url(../../images/common/ajax-loader.gif) no-repeat ce...
本文主要用到的知识 http://www.gxlcms.com/wiki/1118.html" target="_blank">HTML5中的File及FileReader接口源码<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>HTML5文件拖拽预览Demo</title><style type="text/css">h1{padding:0px;margin:0px;}p#show{border: 1px solid #ccc; width: 400px; height: 300px;display: -moz-box;display: -webkit-box;-moz-box-ali...
前两天无意中看了下《pro html5 programming》,发现html5竟然也能很好的支持图像处理，在此稍稍交代一下。与matlab处理图像类似的是，这里也是采用图像矩阵的形式。下面就介绍一个简单的例子:<!DOCTYPE html> <html> <head> <title>canvas图像处理</title> </head> <body> <h1>canvas</h1> <canvas id="canvas1" width="200" height="150">是时候更换浏览器了<a href="http://firefox.com.cn/download/">点击下载fir...
font</a>-size:24px"> 在上面一篇博文中，我介绍了HTML5应用的简易播放器，这篇博文中介绍一个比较复杂的HTML5游戏-老虎机。 寒假在家玩老虎机输了些许钱，所以自己就萌生了写个老虎机的游戏。开始打算用Visual C++编写的，但是考虑到HTML5的<canvas>对象的简便性，就打算用HTML5编写了。 同时还用ASP语言编写了个服务器，如果游戏可以推广的话，自己可以做庄家，让大家玩哦！ 但千万不要聚众赌博哦！ 言归正传，游戏的...
正统的HTML5 Canvas中如下代码ctx.lineWidth = 1; ctx.beginPath(); ctx.moveTo(10, 100); ctx.lineTo(300,100); ctx.stroke();运行结果绘制出来的并不是一个像素宽度的线感觉怎么好粗啊，跟常常见到的网页版各种绘制线效果很不一样，难道HTML5 Canvas就没想到搞好点嘛其实这个根本原因在于Canvas的绘制不是从中间开始的而是从0～1，不是从0.5～1 + 0～0.5的绘制方式，所以导致fade在边缘，看上去线很宽。解决方法有两个，一个是错...
在HTML5中，拖放是标准的一部分，任何元素都能够拖放，具体内容如下1、拖放 <!DOCTYPE HTML> <html> <head> <style type="text/css"> #p1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;} </style> <script> function allowDrop(ev) { ev.preventDefault(); } function drag(ev) { ev.dataTransfer.setData("Text",ev.target.id); } function drop(ev) { ev.preventDefault(); v...
拖放拖放是一种常见的特性，即抓取对象以后拖到另一个位置。在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放。Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 支持拖动。注意:Safari 5.1.2不支持拖动.实例:<!DOCTYPE html> <html> <head> <title>拖放</title> <style type="text/css"> #p1{width:360px;height:220px;padding:20px;border:1px solid black;} </style> <script> function allowDrop(ev) ...