在对JavaScript进行了简单的学习后,今天利用它制作了一个简单的选择栏设置。 在进行的时候我们要先知道我们的目的是什么,如下, 我们很容易看出来,当我们鼠标进去选择栏三个标题后,我们需要得到我们要看的内容以及标题的改变。 下面进行我们的思路分析,1 ...
在对JavaScript进行了简单的学习后,今天利用它制作了一个简单的选择栏设置。
在进行的时候我们要先知道我们的目的是什么,如下,
我们很容易看出来,当我们鼠标进去选择栏三个标题后,我们需要得到我们要看的内容以及标题的改变。
下面进行我们的思路分析,
1 标题,内容能够改变的原因是鼠标进入了标题。
2 标题的改变内容有背景色和下滑栏。
3 内容的改变是因为有些隐藏了,有些显示了。
我把代码分享给大家:
<!DOCTYPE html> <style> #tupian,#junshi{ </style> document.getElementById("xinwen").style.display = "block";/*内容显示*/
document.getElementById("tupian").style.display = "none";
/*内容隐藏*/
document.getElementById("x").style.backgroundColor="#ffffff";
/*颜色改变*/
document.getElementById("x").style.borderBottom= "none";
/*底边隐藏*/
document.getElementById("x").style.background="none"; document.getElementById("x").style.borderBottom= "1px solid gray"; document.getElementById("x").style.background = "none"; document.getElementById("x").style.borderBottom = "1px solid gray";以上代码比较简单,望大家支持。我们再进行一次总结,在进行程序操作之前,我们要明白:
原标题:简单的选项栏设置。
关键词:
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。