javascript与css

最新推荐文章于 2024-01-21 17:13:07 发布

咩咩573

最新推荐文章于 2024-01-21 17:13:07 发布

阅读量1k

点赞数

文章标签： java

本文链接：https://blog.csdn.net/qq_68180489/article/details/124030019

版权

一、通过js修改元素的样式

二、js菜单

1.写好样式；
2.写好函数；
3.不同事件调用不同函数。

当有很多行代码相同时，例如：
<li οnmοuseοver="mya(this)" οnmοuseοut="myb(this)">第一行</li>
<li οnmοuseοver="mya(this)" οnmοuseοut="myb(this)">第二行</li>
<li οnmοuseοver="mya(this)" οnmοuseοut="myb(this)">第三行</li>
……

以上代码相同的，相同的<li> 和事件
JS简化写思路：
1.获得<li>标签对象集合
2.循环集合中的对象，对象.事件=function(){}

代码：
var arr=document.getElementByTagName("li");
for(var i=0; i<arr.length; i++){
arr[i].className="vb";
arr[i].οnmοuseοver=function(){
this.className="va";
};
arr[i].οnmοuseοut=function(){
this.className="vb";
}
}

三、动态改变文字样式

四、图片跟随滚动条

获取类样式的方法：
currentStyle
getComputedStyle()

网页的三维：x,y,z
层的浮动：position:absolute;
   top:20px;
   left:20px;
   right:20px;
   bottom:20px;

滚动事件：
   currentStyle
   //得到当前样式
   currentStyle.top //当前与top

与top的距离
与left的距离
scrollTop滚动距离

//window滚动事件
window.οnscrοll=mymove;
</script>

<body οnlοad="myload()">
……

咩咩573

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript与css

一、通过js修改元素的样式<style>.va{border:1px solid #c00;}.vb{border:0;}</style><script type="text/javascript">function mya(obj){ obj.className="va";}function myb(obj){ obj.className="vb";}</script><body><div o...
复制链接

扫一扫