【问题标题】:How to make a div glow with jquery如何使用 jquery 使 div 发光
【发布时间】:2013-03-05 19:25:20
【问题描述】:

我想知道如何在页面加载后使 div 以特定颜色发光。

<div id="glow" class="logo registrer"><a href="http://henricson.net/registrer.php" class="understrek">Registrer deg</a></div>

这是我想要发光的 div。 谢谢你:)

【问题讨论】:

  • 你所说的发光是什么意思?您可以发布您尝试解决此问题的代码吗?

标签: jquery html colors glow


【解决方案1】:

CSS3 可以做到这一点:

-webkit-box-shadow:0 0 20px blue; 
-moz-box-shadow: 0 0 20px blue;
box-shadow:0 0 20px blue;

这是一个JSFiddle,表明它确实如此,事实上,它对我来说很好,检查一下看看:)

【讨论】:

  • 正是我想要的!谢谢! :)
【解决方案2】:

我不确定你的意思是如何发光?如果只是简单地改变颜色,那么您可以执行以下操作。

$(document).ready(function(){
   $('#glow').animate({backgroundColor:'green'});
});

然后您可以添加一些box-shadow 来添加发光效果。

-webkit-box-shadow: 0px 0px 5px 5px rgba(0, 150, 0, 0.3);
box-shadow: 0px 0px 5px 5px rgba(0, 150, 0, 0.3);

请参阅此示例fiddle,添加了动画背景颜色和阴影。

编辑

抱歉,我忘了提及您需要添加 color animation plugin 才能执行此操作。

这里还有另一个fiddle,它会在半秒后运行,然后消除发光.... 显然这需要进行大量调整以使其看起来不错。

【讨论】:

    【解决方案3】:
    <div class="col-md-6 col-md-offset-3" id="notificationmain">
      <div class="sub"><blockquote id="notification" class="alert alert-success" glowing="0">User Has been created</blockquote></div>  
    
        <script>
            $(document).ready(function() {
                setTimeout(function () { $('.sub blockquote').glow('#FFFFDD', 800); }, 100);
            });
        </script>
    </div>
    

    你需要参考

    <script src="~/Scripts/jquery.glow.js"></script>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-06-28
      • 1970-01-01
      • 2011-03-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-07-19
      • 1970-01-01
      相关资源
      最近更新 更多