hover事件&其他
2015-12-09 18:30:27 小德 前端 访问次数 1939


hover事件实现防止位置变化:先为目标选择其设置border,并且赋值为透明,hover 事件内容只需改变其框线颜色,或者背景颜色。

example:
.exa{  
    solid transparent 1px;
}
.exa:hover{
 border-color: #009FE9;
 background-color: #f5fcff;
}


默认显示一行数据,并且'查看更多’按钮隐藏 ;单击'查看更多’连接显示全部。js 实现:
先将'查看更多按钮隐藏',当数据超过一行后显示查看更多,并且数据内容框限制指显示一行数据,点击’查看更多‘,数据框max-heigth设置为none,'查看更多'按钮隐藏。
先给

<a href="#" class="more" style="display:none" onclick="$(this).prev().css('max-height','none');$(this).hide();return false;">+查看更多</a>
<script>
var a =$('.shop_namewy p').height();
if( Number(a) > 25 ){
$('.shop_namewy p').css("max-height","20px")
 $('.shop_namewy a').show();
  }
</script>



背景图添加背景图:

.example{
    background:#9CCE00 url(存储路径/图片名.jpg) no-repeat bottom;
}