我可以用CSS等其他方法做到这一点吗？

我试图做一个函数，当做一个'悬停'阴影它发生在该类的所有按钮，除此之外，我不能给一个id，因为按钮创建取决于去的新闻数据库因此无法为每个按钮提供id来通过jQuery选择它们，然后显示代码和结果。我可以用CSS等其他方法做到这一点吗？

谢谢你的帮助。

jQuery函数

$('.btn-secondary').hover(function(){ 
    $('.btn-secondary').css('boxShadow', '0 15px 15px 0 rgba(0,0,0,0.24),0 17px 20px 0 rgba(0,0,0,0.19)'); 
}, function(){ 
     $('.btn-secondary').css('boxShadow', 'none'); 

})

container.php

<hr> 
<div class="container"> 
    <div class="row"> 
     <div class="col-md-1"></div> 
     <?php 
       $link=conectar(); 
          $dc=mysqli_query($link,"Select * from tbl_noticias_blog Order By id DESC limit 3");   
          while($titulo=mysqli_fetch_array($dc)){ 
      ?> 

      <div class="col-md-3"> 
       <h2> 
        <?php echo $titulo['titulo']; ?> 
        <input type="hidden" id="id" value="<?php echo $titulo['id'] ?>"> 
       </h2> 
       <p> 
        <?php echo utf8_encode($titulo['dcorta']); ?>. </p> 
       <button class="btn btn-secondary" onclick="irnoti(<?php echo $titulo['id'];?>);" role="button"><span>Ver detalles</span></button> 
      </div> 
      <?php 
          } 
      ?> 
    </div> 
    <br> 
    <br> 


</div>

它是如何显示的影子： How it see

我想怎么阴影： How i want

来源

2017-09-03 felipe andrade

我强烈建议[通过jQuery的API文档阅读]（HTTP：// api.jquery.com/）。它只需要一两个小时，并立即支付你的时间。与'on'一样，'hover'提供的元素引用为'this'。 –

你可以用纯css做到这一点，而不使用jquery –

感谢您接受答案，也请投我的答案 –

使用纯CSS没有的jQuery，你可以做到这一点阴影效果

.shadow_effect{ 
 
background-color:#727b84; 
 
color:#fff; 
 
border-radius:2px; 
 
border:none; 
 
padding:5px 5px; 
 
} 
 
.shadow_effect:hover{ 
 
box-shadow:0 15px 15px 0 rgba(0,0,0,0.24),0 17px 20px 0 rgba(0,0,0,0.19); 
 
}

<button class="shadow_effect">Button 1</button> 
 
<button class="shadow_effect">Button 2</button>

来源

2017-09-03 15:59:25

谢谢我的问题与我的问题回答!!我使用jquery来尝试不同种类的想法，但在CSS上很容易。 –

欢迎大家投票选出答案plz –

im lvl1 cant upvote srry –

我可以用CSS等其他方法做到这一点吗？

回答

相关问题