Scriptaculous初试----Highlight(高亮)

最新推荐文章于 2022-05-28 13:45:41 发布

DBCOLOR

最新推荐文章于 2022-05-28 13:45:41 发布

阅读量763

点赞数

分类专栏： Javascript 文章标签： function border 框架存储 div

本文链接：https://blog.csdn.net/DBCOLOR/article/details/2681766

版权

Javascript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

引入框架:
<script type="text/javascript" src="lib/prototype.js"></script>
<script type="text/javascript" src="lib/effects.js"></script>
显示效果的层:
<div id="d1" style="width:300px; height:300px; background-color:#F6F6F6; border:1px solid #000;" onMouseOut="effect_hl_back('d1','#F6F6F6')" onMouseover="effect_hl('d1')">

Hello World!

</div>

JS代码:

<script type="text/javascript">
 function effect_hl(id)
    { 
        var hl =new Effect.Highlight(id,  
      {
          startcolor:'#330033', //开始的背景色
          endcolor:'#FFFF99', //结束时的背景色
          duration:1,   //时长1秒
          keepBackgroundImage:true, //是否保持背景图片,默认为false          
          restorecolor:true  //是否存储最开始的背景色,默认为true 
      });
    }
    function effect_hl_back(id,bgcolor)
    {
       // $(id).setStyle({backgroundColor: '#000'})
       
      var hl=new Effect.Highlight(id,
      {
          startcolor:'#330033',
          endcolor:bgcolor,
          duration:1,
          keepBackgroundImage:true,
          restorecolor:true
      });
    }

    </script>

十年磨一剑，

霜刃未曾试。

今日把似君，

谁为不平事

这才是我应该选择的心境