【bwin中国】将图片的二进制字节,如何将一个

作者:计算机知识

HTML5中与页面展现相关的API

2015/05/15 · HTML5 · HTML5

原稿出处: 涂根华的博客   

在HTML5中,扩充了一个与页面呈现相关的API,分别是Page Visibility API与Fullscreen API; 作用分别如下:

Page Visibility API  是指当页面变为最小化状态恐怕用户将浏览器标签切换来其余标签时会触发。

Fullscreen API 是将页面全体或页面中有些局地区域设为全屏。

Page Visibility API的采纳地方如下:

  1. 1个应用程序中装有多幅图片的幻灯片式的连日播放效果,当页面变为不可知状态(最小化状态只怕将用户浏览器标签切换成其余标签时),图片停播,当页面变为可知状态时,图片继续播放。
  2. 在二个实时呈现服务器端新闻的应用程序中,当页面处于不可知状态(最小化状态可能将用户浏览器标签切换来别的标签时),甘休按期向服务器端请求数据的拍卖,当页面变为可知状态,继续施行定期向服务器端请求数据的拍卖。
  3. 在三个享有播放录像效果的应用程序中,当页面处于不可知状态(最小化状态大概将用户浏览器标签切换成别的标签时),暂停止播放放录制,当页面变为可知状态时,继续播放录像。

浏览器扶助程度:Firefox10 ,chrome14 ,IE拾 ;

实现Page Visibility API

在选用Page Visibility API时,大家首先需求推断当前用户所利用的浏览器以及该浏览器是不是帮衬。代码如下剖断:

JavaScript

if(typeof document.hidden !== 'undefined') { hidden = 'hidden'; visibilityChange = 'visibilitychange'; }else if(typeof document.mozHidden !== 'undefined') { hidden = 'mozHidden'; visibilityChange = 'mozvisibilitychange'; }else if(typeof document.msHidden !== 'undefined') { hidden = 'msHidden'; visibilityChange = 'msvisibilitychange'; }else if(typeof document.webkitHidden !== 'undefined') { hidden = 'webkitHidden'; visibilityChange = 'webkitvisibilitychange'; }

1
2
3
4
5
6
7
8
9
10
11
12
13
if(typeof document.hidden !== 'undefined') {
    hidden = 'hidden';
    visibilityChange = 'visibilitychange';
}else if(typeof document.mozHidden !== 'undefined') {
    hidden = 'mozHidden';
    visibilityChange = 'mozvisibilitychange';
}else if(typeof document.msHidden !== 'undefined') {
    hidden = 'msHidden';
    visibilityChange = 'msvisibilitychange';
}else if(typeof document.webkitHidden !== 'undefined') {        
    hidden = 'webkitHidden';
    visibilityChange = 'webkitvisibilitychange';
}

如上,在Page Visibility  API中,能够经过document对象的hidden属性值来决断页面是或不是处于可见状态,当页面处于可知状态时属性值为false,当页面处于不可知状态时属性值为true。

在Page Visibility中,能够经过document对象的visibilityState属性值来推断页面包车型地铁可见状态。该属性值为一个字符串,其含义如下所示:

    visible: 页面内容部分可见,当前页面位于用户正在查看的浏览器标签窗口中,且浏览器窗口未被最小化。

    hidden: 页面内容对用户不可知。当前页面不在用户正在查看的浏览器标签窗口中,或浏览器窗口已被最小化。

    prerender: 页面内容已被预渲染,但是对用户不可知。

现行反革命大家来看三个demo,页面中有一个video成分与二个”播放”按键,用户单击”播放”按键时 开关文字变为 ’暂停”,同时启幕播报video成分的录制,当页面变为最小化状态或用户浏览器标签切换来任何标签时候,录制被中断播放,当页面苏醒符合规律状态或用户将浏览器标签切回页面所在标签时,录制持续播放。

HTML代码如下:

JavaScript

<video id="videoElement" controls width=640 height=360 autoplay> <source src="Wildlife/Wildlife.ogv" type='video/ogg; codecs="theora, vorbis"'/> <source src="Wildlife/Wildlife.webm" type='video/webm' > <source src="Wildlife/Wildlife.mp4" type='video/mp4'> </video> <button id="btnPlay" onclick="PlayOrPause()">播放</button> <div style="height:1500px;"></div>

1
2
3
4
5
6
7
<video id="videoElement" controls width=640 height=360 autoplay>
    <source src="Wildlife/Wildlife.ogv" type='video/ogg; codecs="theora, vorbis"'/>
    <source src="Wildlife/Wildlife.webm" type='video/webm' >
    <source src="Wildlife/Wildlife.mp4" type='video/mp4'>
</video>
<button id="btnPlay" onclick="PlayOrPause()">播放</button>
<div style="height:1500px;"></div>

JS代码如下:

JavaScript

var hidden, visibilityChange, videoElement; if(typeof document.hidden !== 'undefined') { hidden = 'hidden'; visibilityChange = 'visibilitychange'; }else if(typeof document.mozHidden !== 'undefined') { hidden = 'mozHidden'; visibilityChange = 'mozvisibilitychange'; }else if(typeof document.msHidden !== 'undefined') { hidden = 'msHidden'; visibilityChange = 'msvisibilitychange'; }else if(typeof document.webkitHidden !== 'undefined') { hidden = 'webkitHidden'; visibilityChange = 'webkitvisibilitychange'; } document.add伊芙ntListener(visibilityChange,handle,false); videoElement = document.getElementById("videoElement"); videoElement.add伊芙ntListener('ended',videoEnded,false); videoElement.add伊芙ntListener('play',videoPlay,false); videoElement.add伊夫ntListener('pause',videoPause,false); // 假诺页面变为不可知状态 则暂停摄像播放 // 假若页面变为可见状态,则继续录像播放 function handle() { // 通过visibilityState属性值判断页面包车型大巴可知状态 console.log(document.visibilityState); if(document[hidden]) { videoElement.pause(); }else { videoElement.play(); } } // 播放录制function play() { videoElement.play(); } // 暂停止播放放 function pause() { videoElement.pause(); } function PlayOrPause() { if(videoElement.paused) { videoElement.play(); }else { videoElement.pause(); } } function videoEnded(e) { videoElement.currentTime = 0; this.pause(); } function videoPlay(e) { var btnPlay = document.getElementById("btnPlay"); btnPlay.innerHTML = "暂停"; } function videoPause(e) { var btnPlay = document.getElementById("btnPlay"); btnPlay.innerHTML = "播放"; }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
var hidden,
visibilityChange,
videoElement;
if(typeof document.hidden !== 'undefined') {
    hidden = 'hidden';
    visibilityChange = 'visibilitychange';
}else if(typeof document.mozHidden !== 'undefined') {
    hidden = 'mozHidden';
    visibilityChange = 'mozvisibilitychange';
}else if(typeof document.msHidden !== 'undefined') {
    hidden = 'msHidden';
    visibilityChange = 'msvisibilitychange';
}else if(typeof document.webkitHidden !== 'undefined') {
    hidden = 'webkitHidden';
    visibilityChange = 'webkitvisibilitychange';
}
document.addEventListener(visibilityChange,handle,false);
videoElement = document.getElementById("videoElement");
videoElement.addEventListener('ended',videoEnded,false);
videoElement.addEventListener('play',videoPlay,false);
videoElement.addEventListener('pause',videoPause,false);
// 如果页面变为不可见状态 则暂停视频播放
// 如果页面变为可见状态,则继续视频播放
function handle() {
    // 通过visibilityState属性值判断页面的可见状态
    console.log(document.visibilityState);
    if(document[hidden]) {
        videoElement.pause();    
    }else {
        videoElement.play();
    }
}
// 播放视频
function play() {
    videoElement.play();
}
// 暂停播放
function pause() {
    videoElement.pause();
}
function PlayOrPause() {
    if(videoElement.paused) {
        videoElement.play();
    }else {
        videoElement.pause();
    }
}
function videoEnded(e) {
    videoElement.currentTime = 0;
    this.pause();
}
function videoPlay(e) {
    var btnPlay = document.getElementById("btnPlay");
    btnPlay.innerHTML = "暂停";
}
function videoPause(e) {
    var btnPlay = document.getElementById("btnPlay");
    btnPlay.innerHTML = "播放";
}

实现Fullscreen API

在HTML5中,新添了2个Fullscreen API,其效果是将页面全部或页面中某些局地区域设为全屏突显状态。

浏览器援助程度:Firefox10 ,chrome16 ,Safari伍.一

在Fullscreen API中,能够通过DOM对象的根节点目的或某个成分的requestFullscreen属性值和施行相呼应的措施来剖断浏览器是或不是援助Fullscreen API。代码如下:

JavaScript

var docElm = document.documentElement; if(docElm.requestFullscreen) { docElm.requestFullscreen(); }else if(docElm.mozRequestFullScreen) { docElm.mozRequestFullScreen(); }else if(docElm.webkitRequestFullScreen) { docElm.webkitRequestFullScreen(); }

1
2
3
4
5
6
7
8
var docElm = document.documentElement;
if(docElm.requestFullscreen) {
        docElm.requestFullscreen();
}else if(docElm.mozRequestFullScreen) {
        docElm.mozRequestFullScreen();
}else if(docElm.webkitRequestFullScreen) {
        docElm.webkitRequestFullScreen();
}

在Fullscreen API中,也足以通过DOM对象或有个别成分的exitFullscreen与CanvelFullScreen属性和艺术将近期页面或有个别成分设定为非全屏呈现状态。

正如代码:

JavaScript

if(document.exitFullscreen) { document.exitFullscreen(); }else if(document.mozCancelFullScreen) { document.mozCancelFullScreen(); }else if(document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); }

1
2
3
4
5
6
7
if(document.exitFullscreen) {
    document.exitFullscreen();
}else if(document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
}else if(document.webkitCancelFullScreen) {
    document.webkitCancelFullScreen();
}

在Fullscreen API中,能够透过监听DOM对象或某些成分的fullscreenchange事件(当页面或因素从非全屏显示状态变为全屏展现状态,或从全屏显示状态成为非全屏显示状态时触发)。代码如下:

JavaScript

【bwin中国】将图片的二进制字节,如何将一个HTML页面嵌套在另一个页面中。document.addEventListener('fullscreenchange',function(){},false); document.addEventListener('mozfullscreenchange',function(){},false); document.addEventListener('webkitfullscreenchange',function(){},false);

1
2
3
document.addEventListener('fullscreenchange',function(){},false);
document.addEventListener('mozfullscreenchange',function(){},false);
document.addEventListener('webkitfullscreenchange',function(){},false);

在css样式代码中,大家能够利用伪类选取器来单独钦赐处于全屏显示状态的页面或因素样式:

JavaScript

html:-moz-full-screen { background:red; } html:-webkit-full-screen { background:red; } html:fullscreen { background:red; }

1
2
3
4
5
6
7
8
9
html:-moz-full-screen {
    background:red;
}
html:-webkit-full-screen {
    background:red;
}
html:fullscreen {
    background:red;
}

最终我们来看三个demo,在页面中有三个开关,点击后,页面会形成全屏状态,再点击后,页面会脱离全屏;

HTML代码如下:

JavaScript

<input type="button" id="btnFullScreen" value="页面全屏展现" onclick="toggleFullScreen();"/> <div style="width:百分百;" id="fullscreentState">非全屏展现</div>

1
2
<input type="button" id="btnFullScreen" value="页面全屏显示" onclick="toggleFullScreen();"/>
<div style="width:100%;" id="fullscreentState">非全屏显示</div>

Javascript如下:

JavaScript

var docElm = document.documentElement; var fullscreentState = document.getElementById("fullscreentState"); var btnFullScreen = document.getElementById("btnFullScreen"); fullscreentState.style.height = docElm.clientHeight 'px'; document.add伊夫ntListener('fullscreenchange',function(){ fullscreentState.innerHTML = (document.fullscreen) ? "全屏突显" : "非全屏显示"; },false); document.add伊芙ntListener('mozfullscreenchange',function(){ fullscreentState.innerHTML = (document.mozFullscreen) ? "全屏展现" : "非全屏展现"; },false); document.add伊芙ntListener('webkitfullscreenchange',function(){ fullscreentState.innerHTML = (document.webkitFullscreen) ? "全屏显示" : "非全屏展现"; },false); function toggleFullScreen() { if(btnFullScreen.value == '页面全屏展现') { btnFullScreen.value = '页面非全屏展现'; if(docElm.requestFullscreen) { docElm.requestFullscreen(); }else if(docElm.mozRequestFullScreen) { docElm.mozRequestFullScreen(); }else if(docElm.webkitRequestFullScreen) { docElm.webkitRequestFullScreen(); } }else { if(document.exitFullscreen) { document.exitFullscreen(); }else if(document.mozCancelFullScreen) { document.mozCancelFullScreen(); }else if(document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } btnFullScreen.value = "页面全屏呈现"; } }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
var docElm = document.documentElement;
var fullscreentState = document.getElementById("fullscreentState");
var btnFullScreen = document.getElementById("btnFullScreen");
fullscreentState.style.height = docElm.clientHeight 'px';
document.addEventListener('fullscreenchange',function(){
    fullscreentState.innerHTML = (document.fullscreen) ? "全屏显示" : "非全屏显示";
},false);
document.addEventListener('mozfullscreenchange',function(){
    fullscreentState.innerHTML = (document.mozFullscreen) ? "全屏显示" : "非全屏显示";
},false);
document.addEventListener('webkitfullscreenchange',function(){
    fullscreentState.innerHTML = (document.webkitFullscreen) ? "全屏显示" : "非全屏显示";
},false);
function toggleFullScreen() {
    if(btnFullScreen.value == '页面全屏显示') {
        btnFullScreen.value = '页面非全屏显示';
        if(docElm.requestFullscreen) {
            docElm.requestFullscreen();
        }else if(docElm.mozRequestFullScreen) {
            docElm.mozRequestFullScreen();
        }else if(docElm.webkitRequestFullScreen) {
            docElm.webkitRequestFullScreen();
        }
    }else {
        if(document.exitFullscreen) {
            document.exitFullscreen();
        }else if(document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        }else if(document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen();
        }
        btnFullScreen.value = "页面全屏显示";
    }
}

赞 收藏 评论

bwin中国 1

二种情势:

译文来源:

什么将三个HTML页面嵌套在另贰个页面中

2010-05-05 16:45 559人阅读 评论(1) 收藏 举报

其一在做网页中常要使用,有个别通用的剧情可聚焦放在2个页面文件中,别的要用到那几个内容的页面只须求包括(引用)那几个通用文件就能够。那样便于维护,纵然有许多网页,当通用内容须要修改时,只改3个文件就足以了,不必要各种文件单独修改。

最标准的采Nabi方页脚的版权消息等内容能够放在3个称为footer.html文件里, 然后其余页面文件在页面内容的尾声包括这几个文件就足以了,具体育赛事例上边有。

要html文件嵌套,最简易的艺术是选取SSI(Server Side Include)技能,也正是在劳务器端多个文件就被合并了。除了少数无偿网页寄存服务外,大致具有的网页寄存服务器都协理SSI。那也是三个相比推荐的办法,它与ASP和ASP.NET网页使用的语法1模同样。就算网址管理员偏向利用PHP或JSP的话,语法会稍有分化。

对此无法运用SSI、ASP、ASP.NET、PHP和JSP等劳务器端动态页面语言的图景,那里还将介绍二种客户端镶嵌的主意:JavaScript和iframe的主意。当那两种客户端的秘诀都有不小的弊端,一般不推荐使用。

下边对种种艺术单独具体介绍。

1、SSI (Server Side Include)

SSI是壹种简单的动态网页制作技能,可是多少服务器要求网页文件扩张名叫.shtml才干辨识文件中SSI命令。所以假使您的SSI命令看起来不职业,先别遗弃,试着把文件扩张名改为.shtml,恐怕会成功。假使了然自个儿的服务器是还是不是支持SSI,请看另一篇文章。

动用SSI二个局限性是页面一定要放在网页服务器上技能观望效果,在地面是不佳调节和测试的。当然,借使非要在本地调节和测试,就本土装四个Apache服务器好了。

举个例子您想在每一种网页的平底加上一样的版权音信,像

© 二〇〇八 技术员实验室 版权全体

能够把那行新闻放到二个名称为footer.html的公文里,footer.html的内容为:

<center> © 工程师实验室 版权全体</center>;

诸如此类平等路线下的任何页面文件要含有footer.html的SSI命令是:

<!- #include virtual="footer.html" ->(常用)

或者

<!- #include file="footer.html" ->

那二者的差不离是同等的,分化之处在于include virtual前面取的是3个ULANDL格局的渠道,以致还是能够实践3个CGI程序并蕴藏其出口结果,假如你的服务器支持CGI的话。而include file前面取的是四个文件系统路线,并且不可能举办CGI程序。两者都得以承受相对路线,所以对地点那些轻便例子,两者的成效是同样的。倘诺您不明了USportageL路线与文件系统路线两者的区分的话,就用include virtual

越多关于SSI的介绍,请看那篇SSI的介绍小说。

2、PHP

倘若您的服务器援助PHP的话,用PHP引用footer.html文件的写法如下:

<?php include("footer.html"); ?>

那句发号施令所在的文件扩大名必须被为.php。

除去引用本服务器上的文件,PHP的include命令还足以用来引用其余网址上的html文件,比方:

<?php include(http://www.prglab.com/examples/footer.html); ?>

自然你要获取任何网址的允许本领引用别人的文本。

3、ASP和ASP.NET

万一你利用的是不合时宜的ASP,则语法是与地点SSI同样的,不须求别的修改,只要把命令所在文件的庞大名改为.asp就可以。

对此ASP.NET,也是近似,分化之处在于,因为SSI命令是在ASP命令运行此前被第三编写翻译,所以文件名中不能运用ASP.NET的变量。假使一定要用的话,就用ASP.NET的授命来做文件嵌套吧。

比如:

<%

          Response.WriteFile ("footer.html")

%>

越多关于什么在ASP.NET中得以达成动态文件嵌套,请参考微软的那篇小说。

4、JSP (Java Server Page)

JSP文件需求在基于Java的服务器上运营,比如Apache Tomcat。JSP包蕴文件的语法是:

<%@ include file="footer.html" %>

五、客户端包括

5。1 客户端包涵的利害

客户端包括有三种方法:JavaScript和iframe。让大家先看看三种办法各有啥利弊。

两种方法中Javascript生成的页面格式比较好,Javascript能够从二个UEnclaveL取到页面片断然后镶嵌在另1个页面的其余地方。其结果与服务器端包含的结果许多一样,但弊端是客户端必须开启Javascript功用(近年来当先百分之伍九个人是选拔开启的,但也有少数是因为安全地点的考虑不张开)。另三个害处是寻觅引擎是看不到由Javascript包蕴的页面的剧情的,那对你的网址推广比较不利。

运用iframe比较轻松,它能够强制四个HTML页面镶嵌在另一个页面中,类似于是用 object控件将Flash电影、录制、也许MP伍播放器嵌入3个页面中。使用iframe,用户端不要求开启Javascript作用。但不利的方面是iframe有定位的中度和增长幅度,不能够随着被放到页面的高低而改变。当被内置页面大于给定高增加率时,会显得滚动条(当然你也得以选取scrolling = "no" 来强制滚动条不展现,但这么页面内容会来得不完整),影响页面美观。别的正是搜索引擎恐怕不录取iframe引用的页面,不利网址推广。

伍。二 利用JavaScript的客户端包涵

那些方法首要适用于Firefox浏览器(任何操作系统)、IE5以上(Windows)、苹果的Safari浏览器(MacOS X),可以利用1项叫做XMLHTTP 的API技艺来由此Javascript程序读取二个动态读取二个XML文件。那种方法也得以用来读取1个HTML文件,并内置当前网页文件的钦赐地方。

标准网站设计者:不要用这一个! 大概在少数景况下您不得不用JavaScript来贯彻网页嵌套,不过那只是壹种转弯抹角的代替格局。当您的服务器可以援助前面讲的劳动器端嵌套方法时,尤其是专门的学问职员,应竭尽制止采用那种措施,因为你的客户只怕会投诉你做的网页内容不能够被谷歌(Google)搜索到,或无法在少数浏览器中健康展现。

纪事那种办法做的网页只可以在Firefox,Safari,和IE5以上版本的浏览器中健康展现。超越三成个人都以用那二种浏览器的,不过不是全数人,而且有些用户因为安全因素思考会关闭Javascript功用。

根本提醒:只要您是在地头计算机上调度网页而不是在服务器上浏览,最新版本的IE浏览器会活动屏蔽Javascript动态变化的片段,并出示警告新闻,你不能够不挑选”允许展现动态内容”网页本事健康彰显。当您把那一个网页文件放到服务器上去的时候这几个难点就会自动消失的,因为IE会辨别出主页和被含有的网页内容都源于同2个服务器。

好了,说了够多了,上边是现实如何做。把以下代码放在网页的<head>里面:

<script>
function clientSideInclude(id, url) {
var req = false;

// Safari, Firefox, 及别的非微软浏览器
if (window.XMLHttpRequest) {
try {
req = new XMLHttpRequest();
} catch (e) {
req = false;
}
} else if (window.ActiveXObject) {

// For Internet Explorer on Windows
try {
req = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
req = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
req = false;
}
}
}
var element = document.getElementById(id);
if (!element) {
alert("函数clientSideInclude不可能找到id " id "。"
"你的网页中必须有2个分包那些id的div 或 span 标签。");
return;
}
if (req) {
// 同步请求,等待接受全体内容
req.open(’GET’, url, false);
req.send(null);
element.innerHTML = req.responseText;
} else {
element.innerHTML =
"对不起,你的浏览器不帮助"
"XMLHTTPRequest 对象。这么些网页的呈现需求"
"Internet Explorer 5 以上版本, "
"或 Firefox 或 Safari 浏览器,也说不定会有别的可相称的浏览器存在。";
}
}
</script>
有了那段代码我们就可以在网页的其余岗位插入另三个页面了。首先我们要生成多少个作为”容器”的HTML控件,比方<span>,并给那个”容器”控件贰个ID,比方includefooter,然后把这一个ID和要含有的页面包车型大巴UCR-VL地址传递给前边写的这一个js函数clientSideInclude就足以了。

1个索要留意的地点是函数clientSideInclude只有在页面被统统加载后技巧办事,所以大家要求在<body>标签的onload事件上来调用这几个函数,那是最保证的调用时机,因为那个事件触发的时候浏览器鲜明已经完全解析了页面中持有HTML了。

就此,具体代码是:

在急需插入另一页面包车型大巴地点写:
<span id="includefooter" > </span>

在页面开首处标签里写:
<body onLoad="clientSideInclude('includefooter', 'footer.html');>

当然,你也能够把函数clientSideInclude放在一个独立的文本之中,举个例子命名字为clientSideInclude.js,然后在您的页面<head>标签中插入上面那<script>标签以便能够调用那几个函数:
<script src="clientSideInclude.js" language="JavaScript"> </script>

五。三 利用iframe的客户端包括

客户端页面嵌套还是能使用iframe的主意,弊端是必须先行想好被嵌套的页面在首页中要占多大的岗位。如若被嵌套页面太大,当先事先定义的增长幅度或可观,则首页会产出滚动条。这大概正是你所急需的,但大概会全盘毁掉主页的安顿性。

iframe的选拔不会细小略,上面包车型地铁例证会在您的页面中放置另贰个称为include.html的页面:

<iframe src="included.html" width="450" height="400" >

<a href="included.html">你的浏览器不补助iframe页面嵌套,请点击那里访问页面内容。</a>

</iframe>

那边主页中定义了要插入的页面将彰显的莫斯中国科学技术大学学为400的像素,宽度为4四十一个像素。

咱俩怎么要在 iframe的当中插入八个普普通通的一级链接成分<a>呢?那是因为老版本的浏览器和查找引擎不协助iframe,即便现在一度很少有人还会使用Netscape 肆那样老的浏览器了,不过大致全数人都会采取米囊花歌(Google)那样的物色引擎。在iframe里面增添一流链接能够扶持搜索引擎找到网页的内容。

别的大家得以定义iframe的有个别性子来决定网页的来得效果 ,除了前方用到的最常用宽度(width)和高度(height)的定义外,假设在任何情况下都不愿意出现滚动条的话,能够定义iframe的scrolling属性等于"no"。假如不期望镶嵌页面包车型客车周边出现边框的话,能够将frameborder属性设置为0。下边那些例子展现了scrolling和frameborder属性的应用:

<iframe src="included.html" width="450" height="400" frameborder="0" scrolling="no">

<a href="included.html">你的浏览器不扶助iframe页面嵌套,请点击那里走访页面内容。</a>

</iframe>

转自:

后端的一般管理程序:Imge.ashx

原文:HTML5 Page Visibility API

bwin中国 2bwin中国 3

译文:HTML 五的页面可视性API

 1 using System;
 2 using System.Collections.Generic;
 3 using System.Linq;
 4 using System.Web;
 5 using System.Web.UI.WebControls;
 6 
 7 namespace Test
 8 {
 9     /// <summary>
10     /// Imge 的摘要说明
11     /// </summary>
12     public class Imge : IHttpHandler
13     {
14 
15         public void ProcessRequest(HttpContext context)
16         {
17 
18             #region 方法一
19             System.IO.MemoryStream ms = new System.IO.MemoryStream();
20             System.IO.Stream str = new FileUpload().PostedFile.InputStream;
21             System.Drawing.Bitmap map = new System.Drawing.Bitmap(str);
22             map.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
23             context.Response.ClearContent();
24             context.Response.ContentType = "image/Jpeg";
25             context.Response.BinaryWrite(ms.ToArray());  //将二进制字节输出到页面 
26             #endregion
27 
28             #region 方法二
29             System.IO.FileStream fs = new System.IO.FileStream("Filename", System.IO.FileMode.Open, System.IO.FileAccess.Read);
30             byte[] datas = new byte[fs.Length];
31             fs.Read(datas, 0, Convert.ToInt32(fs.Length));
32             fs.Close();
33             context.Response.OutputStream.Write(datas, 0, Convert.ToInt32(fs.Length));
34             context.Response.End();
35             #endregion
36         }
37 
38         public bool IsReusable
39         {
40             get
41             {
42                 return false;
43             }
44         }
45     }
46 }

译者:dwqs

View Code

 bwin中国 4

HTML页面代码:

在初期,浏览器并未提供选项卡,不过未来着力具备浏览器都提供了那一个效果。作为三个程序猿,小编一般会同时张开拾到壹多少个选项卡,以至有个别时候会在二5到30.

1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4     <title></title>
5 </head>
6 <body>
7 <img src="/Imge.ashx" />  <!---图片的src指向Imge.ashx 就可以--->
8 </body>
9 </html>

干什么介绍Page Visibility API呢?

 

事先,是不容许鲜明哪些选项卡是激活的,哪个未有激活,不过在HTML 5 Visibility API的扶助下,就能够检查实验用户是或不是在浏览有些网址的页面。

在那篇小说中,我们将会驾驭什么利用HTML 伍 Visibility API,并且用二个小demo去开采页面包车型大巴情景。在这么些demo中,将依照页面包车型大巴可视性状态弹出文书档案的标题。

检查页面包车型地铁可知性

为了利用Visibility API,我们要先掌握八个新的文书档案属性,第2个是document.visibilityState,另三个是document.hidden.它们的成效是例外的。

document.visibilityState有四个分歧的值:

一、hidden:页面在其他显示器上不可知

本文由bwin必赢发布,转载请注明来源

关键词: HTML5 HTML ASP.NET bwin登录网址