长沙我心飞扬seo » Javascript http://www.wxfy.net 长沙seo,长沙网站建设,长沙网站优化首选我心飞扬seo Thu, 22 Jul 2010 13:09:19 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 如何使层固定在网页底部? http://www.wxfy.net/div-bottom/ http://www.wxfy.net/div-bottom/#comments Mon, 08 Mar 2010 00:52:29 +0000 阿非 http://www.wxfy.net/?p=223 如何使层固定在网页底部? 如果抛开IE6的话，只需要CSS就可以了，所以兼容IE6还需要一段JS。

第一部分：CSS
<STYLE>

#fdc{ background:#f4f4f4 ;  width:100%; position:fixed; height:35px; left:0; bottom:0; overflow:hidden;}

.fdcnr{width:1000px; margin:0 auto; position:relative; height:35px; padding:3px 0 2px 0;}

.fdcleft{float:left;}

.fdcleft1{ float:left;}

</STYLE>

第二部分：兼容Ie6的js
<!–[if lte IE 6]>

<script type=”text/javascript”>

if(typeof document.compatMode!=’undefined’&&document.compatMode!=’BackCompat’){

cot_t1_DOCtp=”_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth – offsetWidth);}”;

}else{

cot_t1_DOCtp=”_top:expression(document.body.scrollTop+document.body.clientHeight-this.clientHeight);_left:expression(document.body.scrollLeft + document.body.clientWidth – offsetWidth);}”;

}

var fdc_bodyCSS=’* html {background:url(/images/common/blank.gif) fixed;background-repeat: repeat;background-position: right bottom;}’;

var fdcCSS=’#fdc {position:fixed;’;

var fdcCSS=fdcCSS+’_position:absolute;’;

var fdcCSS=fdcCSS+’z-index:1;’;

var fdcCSS=fdcCSS+’width:100%;’;

var fdcCSS=fdcCSS+’text-align:center;’;

var fdcCSS=fdcCSS+’bottom:0px;’;

var fdcCSS=fdcCSS+’right:0px;’;

var fdcCSS=fdcCSS+’clip:rect(0 100% 100% 0);’;

var fdcCSS=fdcCSS+cot_t1_DOCtp;

document.write(’<style type=”text/css”>’+fdc_bodyCSS+fdcCSS+’</style>’);

</script>

<![endif]–>

第三：html部分
<DIV id=”fdc”>

<DIV align=”center” style=”margin:0 auto”>

<TABLE width=”998″ border=”0″ align=”center” style=”margin:0 auto”>

<TBODY><TR>

<TD><DIV class=”fdcnr”><DIV class=”fdcleft”><A href=”http://kft.zoosnet.net/LR/Chatpre.aspx?id=KFT77879183″ target=”_blank”><IMG src=”/skin/images/fuzhou-01.gif”></A></DIV>

<DIV class=”fdcleft”>

<A href=”http://kft.zoosnet.net/LR/Chatpre.aspx?id=KFT77879183″ target=”_blank”><IMG src=”/skin/images/fuzhou-02.gif”></A>

</DIV>

<DIV class=”fdcleft”><A href=”http://kft.zoosnet.net/LR/Chatpre.aspx?id=KFT77879183″ target=”_blank”><IMG src=”/skin/images/fuzhou-03.gif”></A></DIV></DIV> </TD>

</TR>

</TBODY></TABLE>

</DIV>

</DIV>

实例参考：裕湘医院,猛击进入

<!–[if lte IE 6]>
<script type=”text/javascript”>
if(typeof document.compatMode!=’undefined’&&document.compatMode!=’BackCompat’){
cot_t1_DOCtp=”_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);_left:expression(document.documentElement.scrollLeft + document.documentElement.clientWidth – offsetWidth);}”;
}else{
cot_t1_DOCtp=”_top:expression(document.body.scrollTop+document.body.clientHeight-this.clientHeight);_left:expression(document.body.scrollLeft + document.body.clientWidth – offsetWidth);}”;
}
var fdc_bodyCSS=’* html {background:url(/images/common/blank.gif) fixed;background-repeat: repeat;background-position: right bottom;}’;
var fdcCSS=’#fdc {position:fixed;’;
var fdcCSS=fdcCSS+’_position:absolute;’;
var fdcCSS=fdcCSS+’z-index:1;’;
var fdcCSS=fdcCSS+’width:100%;’;
var fdcCSS=fdcCSS+’text-align:center;’;
var fdcCSS=fdcCSS+’bottom:0px;’;
var fdcCSS=fdcCSS+’right:0px;’;
var fdcCSS=fdcCSS+’clip:rect(0 100% 100% 0);’;
var fdcCSS=fdcCSS+cot_t1_DOCtp;
document.write(’<style type=”text/css”>’+fdc_bodyCSS+fdcCSS+’</style>’);
</script>
<![endif]–>
]]> http://www.wxfy.net/div-bottom/feed/ 0 禁止复制网页内容的代码 http://www.wxfy.net/prohibit-copy-page-content/ http://www.wxfy.net/prohibit-copy-page-content/#comments Tue, 22 Dec 2009 00:31:45 +0000 阿非 http://www.wxfy.net/?p=133 偶尔可能需要禁止别人复制网页里的内容，那么

将body改为以下代码就可以实现网页内容不被复制，当然只能防止直接的方式，查看源代码，右键还是可以用。

如果对方使用采集的话，也没什么效果。。
<body oncontextmenu=’return false’ ondragstart=’return false’ onselectstart =’return false’ onselect=’document.selection.empty()’ oncopy=’document.selection.empty()’ onbeforecopy=’return false’ onmouseup=’document.selection.empty()’>

]]> http://www.wxfy.net/prohibit-copy-page-content/feed/ 1 利用Lightbox实现自动打开图片 http://www.wxfy.net/lightbox-make-pics-auto-on/ http://www.wxfy.net/lightbox-make-pics-auto-on/#comments Sun, 18 Oct 2009 05:07:25 +0000 阿非 http://www.wxfy.net/?p=42 由于需要打开一个网页就需要自动打开一张图片，在强大的lightbox js的基础上做一下修改即可实现。

修改的地方在lightbox.js最下面

下载之：自动打开图片的lightbox js

]]> http://www.wxfy.net/lightbox-make-pics-auto-on/feed/ 0 自动收缩滚动最后消失的滑动广告代码 http://www.wxfy.net/auto-shrink-ad-code1/ http://www.wxfy.net/auto-shrink-ad-code1/#comments Tue, 13 Oct 2009 01:23:13 +0000 阿非 http://www.wxfy.net/?p=17 该自动收缩滚动最后消失的滑动广告代码的特性：

1.于网页顶部自动滚动弹出，一段时间后自动收缩至顶部并消失

2.兼容各大主流浏览器

3.使用方便简单，可定义滚动速度及广告显示时间。

4.此JS广告代码适用于大幅图片广告或者全屏广告

这个自动收缩滚动最后消失的滑动广告代码在网页中使用大致分为三个部分：

1.网页头部js调用代码

<script language=”javascript” src=”5.js”></script>

<script type=”text/javascript” language=”javascript”>

$(document).ready(function(){

setTimeout(function(){

$(”#main-box”).slideToggle(1000);

setTimeout(function(){$(”#main-box”).slideToggle(2000);},9000);

},2000);

});

</script>

2.网页头部定义的css样式

<style>

#main-box,.box-top{margin:0px auto;height: 1%;overflow: hidden;background:url(images/bg-x.png) repeat-x;}

#main-box .box-top{ display:block; overflow:hidden; height:527px; background:url(/images/guoqing.jpg) top center  no-repeat;}

</style>

3.网页主体的html广告代码

<div id=”main-box” style=”display:none;”>

<a class=”box-top” href=”#” target=”_blank” title=”三节同庆，裕湘医院体检不要钱，看病收半价！”></a>

</div>

下载之：自动收缩滚动最后消失的广告代码

1.网页头部信息
<script language=”javascript” src=”5.js”></script>
<script type=”text/javascript” language=”javascript”>
$(document).ready(function(){
setTimeout(function(){
$(”#main-box”).slideToggle(1000);
setTimeout(function(){$(”#main-box”).slideToggle(2000);},9000);
},2000);
});
</script>
2.网页头部定义的css样式
<style>
#main-box,.box-top{margin:0px auto;height: 1%;overflow: hidden;background:url(images/bg-x.png) repeat-x;}
#main-box .box-top{ display:block; overflow:hidden; height:527px; background:url(/images/guoqing.jpg) top center  no-repeat;}
</style>
3.网页主体的html广告代码
<div id=”main-box” style=”display:none;”>
<a href=”#” target=”_blank” title=”三节同庆，裕湘医院体检不要钱，看病收半价！”></a>
</div>
]]> http://www.wxfy.net/auto-shrink-ad-code1/feed/ 2 如何解决图片过大撑破网页？ http://www.wxfy.net/make-pics-in-webpage/ http://www.wxfy.net/make-pics-in-webpage/#comments Mon, 12 Oct 2009 09:13:03 +0000 阿非 http://www.wxfy.net/?p=12 如何解决图片过大撑破网页？一般解决方法运用css定义图片样式或者js控制图片。

很多时候图片没编辑直接用于网上的话有可能会出现图片撑破网页，css控制overflow:hidden的话，多出的图片会隐藏，因此最好的方法是当图片超过一定宽度的时候给它一个宽度，让图片等比例压缩。那么究竟如何解决图片过大撑破网页呢？

除IE6及以下版本浏览器外：

其他浏览器一般可以用下面这种方法实现：img{maxwidth:600px}，这个意思是图片的最大宽度是600像素，这种方法IE6不支持，优点是实现很简单，不需要等图片下载完之后才能控制，因为CSS先下载完。

能兼容IE6的方法：

1.在img标签中使用“ onload=”if(this.width>600)this.width=600″ ”这样子的属性就可以在ie下控制图片的最大宽度，缺点是必须等图片载入后这个onload才会起作用。

2.在css中定义img {max-width: 600px; width:expression(this.width > 600 ? “600px” : this.width)}，因为ie6支持expression，不过似乎比较占用资源。

3.使用 JavaScript 调整
一般情况下大多数人会使用 JavaScript，但脚本只能在页面装载完成之后执行，网络状况不太好的话，需要加载很长一段时间才能轮到脚本执行，用户体验较差；另外，如果用户关闭了浏览器的 JavaScript 支持，这个方法也就失效了。这里提供一个，貌似管用..

<script type=”text/javascript”>

window.onload = function() {

for (var index = 0; index <document.images.length; index++) {

var maxWidth = 600;

if (document.images[index].width> maxWidth) {

document.images[index].width = maxWidth;

}

}

}

</script>

<script type=”text/javascript”>
window.onload = function() {
for (var index = 0; index <document.images.length; index++) {
var maxWidth = 600;
if (document.images[index].width> maxWidth) {
document.images[index].width = maxWidth;
}
}
}
</script>
]]> http://www.wxfy.net/make-pics-in-webpage/feed/ 0