分栏浮动广告

最新推荐文章于 2024-08-10 17:13:35 发布

iteye_891

最新推荐文章于 2024-08-10 17:13:35 发布

阅读量100

点赞数

分类专栏： javascript 文章标签： jQuery CSS HTML XHTML ViewUI

本文链接：https://blog.csdn.net/iteye_891/article/details/81801483

版权

javascript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

jquery 分栏浮动
代码如下：
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="jquery-1.3.1.min.js"></script>
<title>无标题文档</title>
<style>
.left1_top {
background-color:#FF0000;
}
.left1_top_change {
background-color:#FF0000;
float:right;
width:30%;
}
.right1_left {
background-color: #0000FF;
}
.right1_left_change {
background-color: #0000FF;
float:left;
width:70%;
}
</style>
<SCRIPT>
function switchSysBar(){
var img = document.getElementById("barImg").src;
if(img.indexOf("right") > 0){
document.getElementById("switchPoint").innerHTML = '<img id="barImg" src="left.gif">';
document.getElementById("frmTitle").style.display="none";
$("#left_top").attr('class','left1_top_change');
$("#right1_left").attr('class','right1_left_change');
var left1HTML = $("#left1").html();
var right1HTML = $("#right1").html();
$("#left_top").remove();
$("#right1").html(right1HTML+left1HTML);
}else{
document.getElementById("switchPoint").innerHTML = '<img id="barImg" src="right.gif">';
document.getElementById("frmTitle").style.display="";
$("#left_top").attr('class','left1_top');
$("#right1_left").attr('class','right1_left');
var temp = $("#left_top");
$("#left_top").remove();
$("#left1").append(temp);

}
}

</SCRIPT>

<script>
$(function() {
$("#topLink").css({top:(window.screen.availHeight-($("#topLink").height()*12))});
var menuYloc = $("#topLink").offset().top;
$(window).scroll(function() {
var offsetTop = menuYloc + $(window).scrollTop() + "px";
$("#topLink").animate({top: offsetTop}, {duration: 300, queue: false});
});
});
</script>

</head>

<body>

<table width="100%" height="1298" border="1">
<tr>
<th width="20%" valign="top" scope="col" id="frmTitle">
<div id="left1"><div id="left_top" class="left1_top">left1 <br />left1<br />left1</div></div>
<div id="left2"><div style="background-color: #00FF00">left2<br />left2<brleft2</div></div>
</th>
<th width="1%" valign="middle" scope="col" >
<div id="topLink" style="position:absolute;"><SPAN οnclick="switchSysBar()" id=switchPoint title=关闭/打开左栏><IMG src="right.gif" name="barImg" id="barImg"></SPAN></div>
</th>
<th valign="top" scope="col">
<div id="right1">
<div id="right1_left" class="right1_left">right1<br />right1<br />right1</div>
</div>
<div id="right2"><div style="background-color: #99FF66">right2<br />right2<br />right2</div></div>
</th>
</tr>
</table>
</body>
</html>