http://www.richurl.com/点收藏后，父页面变灰如何实现的

http://www.richurl.com/
---
点收藏后的主页面效果

解决方案 »

  1.   

    可以使用滤镜，给你转个例子。
    具体你可以在点收藏之后执行这段代码<script>
    var timer
    var Opacity = 0
    function hide() {
      oDiv.style.display = "block"
      oDiv.style.height = document.body.scrollHeight
      Opacity = 0
      event.srcElement.blur()
      timer = window.setInterval("aa()", 5)
    }function aa()
    {
      if (Opacity == 50)
      {
        window.clearInterval(timer)
        oButton.style.display = "block"
        return
      }
      Opacity = ( Opacity + 3 ) > 50 ? 50 : Opacity + 3
      oDiv.style.filter = "Alpha(Opacity="  + Opacity + ")"
    }function bb()
    {
      if (Opacity == 0)
      {
        window.clearInterval(timer)
        oDiv.style.display = "none"
        return
      }
      Opacity = (Opacity - 3 < 0) ? 0 : Opacity - 3
      oDiv.style.filter = "Alpha(Opacity="  + Opacity + ")"
      
    }function cc()
    {
      timer = window.setInterval('bb()', 5);
      oButton.style.display='none';
    }
    </script>
    <body topmargin=0 leftmargin=0>
    <div id=oDiv style="position:absolute;z-index:99; background-color:darkgray; Filter: Alpha(Opacity=0); border:1px solid #333333;display:none;width:100%;vertical-align:center;text-align:center">&nbsp;</div>
    <button onclick=hide()>hide</button>
    <button id=oButton style="position:absolute; left:100;top:200;z-index:100;display:none" onclick="cc()">确定</button>
    <script>
      for (var i=0; i<30; i++)
      document.write ("<p>123</p>")
    </script>