↓用长文本分页时加这个
#frameContent{
width:400px; /*调整显示区的宽*/
height:300px; /*调整显示区的高*/
font-size:14px;
line-height:20px;
border:1px solid #000000;
overflow-pageINdex:hidden; /*不显示超过指定页的内容*/
overflow-y:hidden; /*不显示超过指定高度的内容*/
word-break:break-all; /*文本换行行为,如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的前端部分),下一行为tulation(conguatulation)的后端部分了,汉字会被当作字母处理,所以中文的自动换行需要用这个属性值。还有一个word-wrap,不截断单词直接换行,但这个属性如果用到中文上,将产生不可预料的结果*/
}
a{
font-size:12px;
color:#000000;
text-decoration:underline;
}
a:hover{
font-size:12px;
color:#CC0000;
text-decoration:underline;
}
↓用时间时加这个
#time{
width:200px;
height:40px;
float:right;
line-height:40px;
text-align:center;
font-size:24px;
background:#0CF;
}
-------------------------------------------------------------------------------------------------------------
-------------------------------------------------------------------------------------------------------------
↓变颜色的例子
<ul class="sy">
<li id="td1" onmouseover="over('td1')" onmouseout="out('td1')">首页</li>
<li id="td2" onmouseover="over('td2')" onmouseout="out('td2')">图片</li>
<li id="td3" onmouseover="over('td3')" onmouseout="out('td3')">贴吧</li>
<li id="td4" onmouseover="over('td4')" onmouseout="out('td4')">琪琪</li>
<li id="td5" onmouseover="over('td5')" onmouseout="out('td5')">问问</li>
<li id="td6" onmouseover="over('td6')" onmouseout="out('td6')">嗯嗯</li>
</ul>
↓下拉列表例子
<form>
<select id="pro" onchange="ChangeProvinceSelect(this.selectedIndex)">
</select>
<select id="ci" >
<option >请选择</option>
</select>
</form>
↓长文本分页例子
<div id="frameContent">积极工作
巴斯德曾经说过一句话:立志是事业的大门,工作是登门入室的旅途。我相信主动积极的工作是幸福生活的基础,我们应携起手来主动积极地去完成每一件事情,力求精益求精,摆脱依赖心理,工作就是一份责任,无论什么时候,我们都应该“用积待工作极勤奋的态度对”。生命为什么而精彩?不是你有了多少的财富,也不是你的生活多么的灿烂。而是他的工作为我们这个社会带来了什么。
一朝开始便永远能够将事业续继下去的人是幸福的。积极是一个人进取的表现,积极也是任何公司和企业都提倡的一种工作作风。而责任是保持积极工作态度的重要因素,所以我们要想积极工作,就要对待工作有一颗责任的心,我们对社会,对家庭的责任是不可或缺的。社会的繁荣需要我们的努力工作来维持,家庭的稳定和幸福也要我们的努力来满足。
我们每个人都有着不同的经历和机遇,我们不可能每个人都取得非凡的成就,但是如果我们对身边的每件事情都积极对待,每天进步一点点,我们至少会成为一个优秀的人。面对现实的残酷,我们可能束手无策,DNA我们可以通过改变态度来决定事情的发展。虽然不知道未来会怎样,但我们可以努力做好今天的自己。
在剧烈的竞争当中多付出一点,便可多赢一点。相信每一个积极向上,乐于奉献的人都会有一个光辉的未来。积极、独立、自强、奉献让我们起飞,我们会让我们自己飞的更高!
</div>
<div id="pages" style="font-size:13px;"></div>
↓实施时间例子
<div id="time"></div>
----------------------------------------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------------------------------------------
<script type="text/javascript">
↓这是变颜色的
function over(id){
document.getElementById(id).style.background="skyblue";
document.getElementById(id).style.fontSize = "20px";
}
function out(id){
document.getElementById(id).style.background="white";
document.getElementById(id).style.fontSize = "15px";
}
↓这是换页的
var obj = document.getElementById("frameContent"); //获取内容层
var pages = document.getElementById("pages"); //获取翻页层
window.onload = function() //重写窗体加载的事件
{
var allpages = Math.ceil(parseInt(obj.scrollHeight)/parseInt(obj.offsetHeight));//获取页面数量
pages.innerHTML = "<b>共"+allpages+"页</b>"; //输出页面数量
for (var i=1;i<=allpages;i++){
pages.innerHTML += "<a href=\"javascript:showPage('"+i+"');\">第"+i+"页</a> ";//循环输出第几页
}
}
function showPage(pageINdex)
{
obj.scrollTop=(pageINdex-1)*parseInt(obj.offsetHeight); //根据高度,输出指定的页
}
↓这是下拉的
var province = ["请选择","山东", "河北", "河南"];
var city = [
["请选择"],
["济南", "青岛", "淄博"],
["石家庄", "沧州", "承德"],
["郑州", "洛阳", "焦作"]
];
//new Array()
var pro = document.getElementById("pro");
//指定列表pro中option的数量
pro.length = province.length;
//添加元素
for (var i = 0; i < province.length; i++) {
pro.options[i].text = province[i];
pro.options[i].value = i;
}
function ChangeProvinceSelect(index)
{
var ci = document.getElementById("ci");
ci.length = city[index].length+1;
ci.options[0].text=city[0][0];
for (var i = 0; i < city[index].length; i++)
{
ci.options[i+1].text = city[index][i];
ci.options[i+1].value = city[index][i];
}
}
↓这是时间
window.onload = function() {
var showTime = document.getElementById("time");
setInterval(function() {
var time = new Date();
var hours = time.getHours();
var minutes = time.getMinutes();
var seconds = time.getSeconds();
showTime.innerHTML = hours + ":" + minutes + ":" + seconds;
}, 1000);
};
</script>
07-13
“相关推荐”对你有帮助么?
-
非常没帮助
-
没帮助
-
一般
-
有帮助
-
非常有帮助
提交