HTML之页面镶嵌体验
<!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">
<head>
<title> new document </title>
<meta name="generator" content="editplus" charset="utf-8"/>
<style>
#test{animation-name:html_page;animation-duration:1500ms;animation-timing-function:ease-in-out;}
@keyframes html_page{
0% {transform-origin: 50% 50%;transform: rotate3d(0, 1, 0, 1440deg) rotateZ(45deg) scale(1);}
100% {transform: rotate3d(0, 1, 0, 0) rotateZ(0) scale(1);}
}
@keyframes mymove{
0%{
transform:rotateY(720deg);
}
80%{
transform:rotateY(720deg);
}
100%{
transform:rotateY(0deg);
}
}
</style>
</head>
<body>
<div>
<iframe id="test" width="100%" height=999px frameborder="0" src="" style="margin:0px;" ></iframe>
<script language="JavaScript">
var iframe = document.getElementById("test");
iframe.src = "https://www.cnblogs.com/caidupingblogs/";
//以下判断iframe是否加载完,并且隐藏滚动条
if (iframe.attachEvent){
iframe.attachEvent("onload", function(){
hideS();
document.getElementById("loading").style.display="none";
});
} else {
iframe.onload = function(){
hideS();
document.getElementById("loading").style.display="none";
};
}
</script>
</div>
</body>
</html>
效果显示如下:
HTML之页面镶嵌体验的更多相关文章
- cordova StatusBar插件的使用(设置手机状态栏颜色和页面头部颜色一致),做出和原生一样的页面效果体验
cordova StatusBar插件的使用(设置手机状态栏颜色和页面头部颜色一致),做出和原生一样的页面效果体验设置设备状态栏背景颜色StatusBar.backgroundColorByHexSt ...
- 原创《如何用vue来轻松的驾驭 html5 webapp的页面体验》
由于最近开始要做mobile的webapp 项目,所以利用周末的时间思考了下页面的体验问题,我主要参考了"微信"的页面体验,总结主要有2个页面切换效果(点击进入页面效果 和 返回上 ...
- 浅谈HTML5单页面架构(一)——requirejs + angular + angular-route
心血来潮,打算结合实际开发的经验,浅谈一下HTML5单页面App或网页的架构. 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又要数单页面架构体验 ...
- 使用ASP.NET MVC局部视图避免JS拼接HTML,编写易于维护的HTML页面
以前使用ASP.NET WebForm开发时,喜欢使用Repeater控件嵌套的方式开发前台页面,这样就不用JS拼接HTML或者后台拼接HTML了,写出的HTML页面美观.简捷.易于维护,由于不用JS ...
- AngularJS进阶(二十五)requirejs + angular + angular-route 浅谈HTML5单页面架构
requirejs + angular + angular-route 浅谈HTML5单页面架构 众所周知,现在移动Webapp越来越多,例如天猫.京东.国美这些都是很好的例子.而在Webapp中,又 ...
- MIP 技术月报(4月):支持熊掌号登录;优化页面悬浮元素
之前由MIP团队维护的<移动 Web 加速技术月报>从本期开始,正式升级为<MIP 技术月报>,与以往不同的是,<MIP 技术月报>将会与大家分享包含移动加速技术以 ...
- 转:vue项目如何刷新当前页面
想必大家在刨坑vue的时候也遇到过下面情形:比如在删除或者增加一条记录的时候希望当前页面可以重新刷新或者如下面这种: 如果希望点击确定的时候,Dialog 对话框关闭的时候,当前http://loca ...
- 深入浅出的webpack4构建工具---webpack+vue+router 按需加载页面(十五)
1. 为什么需要按需加载? 对于vue单页应用来讲,我们常见的做法把页面上所有的代码都打包到一个bundle.js文件内,但是随着项目越来越大,文件越来越多的情况下,那么bundle.js文件也会越来 ...
- iOS safari 苹果手机如何阻止页面弹性“橡皮筋效果”?
苹果上这个上下弹的效果对于有固定导航的页面,体验很不好 知乎上搜到一个并不是完美方案:https://www.zhihu.com/question/22256539 完美方案是有个国外插件叫:prev ...
随机推荐
- python range函数与numpy arange函数
1.range()返回的是range object,而np.arange()返回的是numpy.ndarray() range尽可用于迭代,而np.arange作用远不止于此,它是一个序列,可被当做向 ...
- html<input>输入框中各种正则表达式设置
<%@ page language="java" contentType="text/html; charset=gb2312" pageEncoding ...
- 详探TextRange对象--查找与选择(转载)
TextRange对象是动态HTML(DHTML)的高级特性,使用它可以实现很多和文本有关的任务,例如搜索和选择文本.文本范围让您可以选择性的将字符.单词和句子从文档中挑选出来.TextRange对象 ...
- 07.Curator计数器
这一篇文章我们将学习使用Curator来实现计数器.顾名思义,计数器是用来计数的,利用ZooKeeper可以实现一个集群共享的计数器.只要使用相同的path就可以得到最新的计数器值,这是由Zo ...
- php最全基础,数组,函数,超全局变量,时间,回话,文件,php操作mysql
共享一份学习php最全基础语法知识的笔记 原文链接:http://www.cnblogs.com/oscn/p/3607757.html:略有修改 http://www.cnblogs.com/l ...
- poj1952 BUY LOW, BUY LOWER【线性DP】【输出方案数】
BUY LOW, BUY LOWER Time Limit: 1000MS Memory Limit: 30000K Total Submissions:11148 Accepted: 392 ...
- 第二次去苹果店维修MacBook
今天上午,在使用外接鼠标的情况下,屏幕上鼠标指针乱窜.乱点.不受控制的故障再次出现,这次拍下了视频. 再次去苹果网站预约Genius Bar(天才吧),中午的时候去了苹果店.这次没有像上次那样检查身份 ...
- Tickets---hdu1260 (简单dp)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1260 题意就是有n个人排队买票,每个人需要的时间是a[i] (1=< i <=N),但是现 ...
- LockSupport HotSpot里park/unpark的实现
每个java线程都有一个Parker实例,Parker类是这样定义的: class Parker : public os::PlatformParker { private: volatile int ...
- Selenium IDE编辑区域修改操作学习
1.修改command.target.value,选择需要修改的步骤,然后点击下方,既可以直接进行修改. 2.添加新的操作步骤:直接在下方编辑区域的下方点击,然后输入或者选择操作类型,然后点击Targ ...