网站地图 | RSS订阅 凌陈亮博客 - 专业上海SEO上海SEO优化,分享网站优化知识,同时提供上海SEO服务。
你的位置:首页 » JS控制DIV
前端脚本

JS飘浮广告代码(兼容多浏览器)

JS飘浮广告代码(兼容多浏览器)

此JS飘浮广告特效代码可以飘浮DIV层,图层中可放图片、文字等任何HTML内容。满屏到处移动着跑的飘动DIV广告特效。

此浮动代码由本人使用纯原生JS制作,未采用JQUERY。代码规范标准,使用HTML4 XHTML头部标准或HTML5头部都不影响JS的正常运行。

注:飘浮时只在浏览器窗口尺寸(即窗口可见区域大小)里飘动,不受滚动条长短影响。

发布时间:2016年9月7日 | 评论:0 | 浏览: | 标签:Javascript  JS特效  JS控制DIV  浮动  

前端脚本

JS实现DIV高度随浏览器窗口高度自适应变化,兼容各大浏览器

JS实现DIV高度随浏览器窗口高度自适应变化,兼容各大浏览器

因CSS无法设置DIV高度随浏览器窗口的高度自适应变化,故做了此JS函数来实现此功能。

以下代码兼容IE、360、火狐、谷歌、搜狗、百度等各大浏览器。实现DIV高度为浏览器窗口的高度和一半高度。

具体HTML及JS代码如下:

<div id="test" style=" border: solid 1px #f00; "></div>
<script type="text/javascript">
<!--
//作者:凌陈亮www.lingchenliang.com(QQ:57404811)
autodivheight();
function autodivheight(){ //函数:获取尺寸
	//获取浏览器窗口高度
	var winHeight=0;
	if (window.innerHeight)
		winHeight = window.innerHeight;
	else if ((document.body) && (document.body.clientHeight))
		winHeight = document.body.clientHeight;
	//通过深入Document内部对body进行检测,获取浏览器窗口高度
	if (document.documentElement && document.documentElement.clientHeight)
		winHeight = document.documentElement.clientHeight;
	//DIV高度为浏览器窗口的高度
	//document.getElementById("test").style.height= winHeight +"px";
	//DIV高度为浏览器窗口高度的一半
	document.getElementById("test").style.height= winHeight/2 +"px";
}
window.onresize=autodivheight; //浏览器窗口发生变化时同时变化DIV高度
//-->
</script>


发布时间:2016年2月23日 | 评论:2 | 浏览: | 标签:Javascript  JS控制DIV  自适应  JS特效  

前端脚本

JS实现切换标签页,显示隐藏DIV层内容

JS实现切换标签页,显示隐藏DIV层内容

<script type="text/javascript">
//制作:凌陈亮www.lingchenliang.com(QQ:57404811)
//切换标签页/选项卡,显示隐藏DIV层内容,同时更换标签链接样式,可用于多个组,每组多个标签
//兼容IE内核/Firefox火狐/Google谷歌等浏览器
//参数:当前标签ID后缀数字,样式class名称组(未触发时样式|触发时样式),标题ID组,内容ID组

发布时间:2016年1月13日 | 评论:1 | 浏览: | 标签:Javascript  JS控制DIV  切换标签页  显示隐藏DIV  JS选项卡  JS特效  

前端脚本

JS实现DIV盒子高度为宽度2倍

JS实现DIV盒子高度为宽度2倍

JS控制DIV高度,同理可实现控制DIV宽度变化。具体方法如下:


方法一:

<div id="div" style="width: 100px; background: #F90;">test</div>

<script type="text/javascript">
 var div = document.getElementById("div");
 var width=parseInt(div.style.width) || div.offsetWidth;
 div.style.height=width*2 + "px";
</script>

发布时间:2015年12月24日 | 评论:0 | 浏览: | 标签:Javascript  JS控制DIV  JS特效  

«1»