方法描述
鼠标移动到节点上时增加一个样式，移出时去除增加的样式
应用场景
主要应用于商品列表类模块，如商品推荐、分页显示商品等模块，默认显示商品图片等，鼠标移动上去时显示更多商品信息。
方法参数
名称 值 类型 描述
调用语句
<div class="j-module" module-function="tabClass" module-param="{参数一:值,参数二:值,...>模板代码</div>
方法调用 支持传入参数
参数
节点 node string 如：{node:’li’}
当前样式 defaultClass string 如{defaultClass:’jCurrent’}

<div class="j-module" module-function="autoLayout,tabClass" module-param="{defaultClass:'current'}" >
    <ul>
        #foreach($!goods in $!goodsRecList) 
        <li>
            <div class="jItem">
                <div class="jShade"></div>
                <div class="jPic">
                    <a href="$!jshopProduct.getBuyUrl($!goods.goodsId)" target="_blank" style="background-image:url($!jshopCommon.getImage($!goods.imageurl,1))">
                        <img src="$!jshopCommon.getImage($!goods.imageurl,1)" alt="$!goods.wname" width="220" height="280" />
                    </a>
                </div>
                <div class="jGoodsInfo">
                    <div class="jDesc" title="$!goods.wname $!goods.advertWord">
                        <a href="$!jshopProduct.getBuyUrl($!goods.goodsId)" target="_blank">$!goods.wname</a>
                    </div>
                    <div class="jPrice">
                        <div class="jdPrice">
                            <span class="jText">促销价：</span>
                            <span class="jRmb">&yen;</span>
                            $!jshopPrice.getJdPrice($!goods.goodsId)
                        </div>
                    </div>
                </div>
            </div>
        </li>
        #end
    </ul>
</div>

.userjGoodsRecommend{overflow:hidden;}
.userjGoodsRecommend .mt{}
.userjGoodsRecommend .mc{background:#FFF; overflow:hidden; padding-left:3px;}
.userjGoodsRecommend .mb{display:none;}
.userjGoodsRecommend .mc ul{width:100%;}
.userjGoodsRecommend li{float:left; width:220px; margin:0 13px; padding:10px 0; overflow:hidden; display:inline;}
.userjGoodsRecommend .jItem{height:auto; background:#fff; position:relative;}
.userjGoodsRecommend .jPic{text-align:center; _height:100%;}
.userjGoodsRecommend .jPic img{display:none;}
.userjGoodsRecommend .jPic a{display:block; height:280px; width:220px; margin:0 auto; background:center top no-repeat; background-size:cover; -moz-background-size:cover; -webkit-background-size:cover;}
.userjGoodsRecommend .jShade, .userjGoodsRecommend .jGoodsInfo{display:none;}
.userjGoodsRecommend .current .jShade, .userjGoodsRecommend li:hover .jShade{display:inline; position:absolute; width:100%; height:100%; _height:280px; background:#000; opacity:0.5; filter:progid:DXImageTransform.Microsoft.alpha(opacity=50);}
.userjGoodsRecommend .current .jGoodsInfo, .userjGoodsRecommend li:hover .jGoodsInfo{display:inline; width:180px; position:absolute; bottom:30px; left:50%; margin-left:-100px; border-top:solid 1px #fff; padding:8px 10px 0 10px;}
.userjGoodsRecommend .jDesc{height:16px; line-height:1.3; overflow:hidden; color:#333; padding-left:15px; background:url(//img14.360buyimg.com/cms/g12/M00/08/1A/rBEQYFGcNxMIAAAAAAAEI72F9qMAABuQgElqvkAAAST280.png) left 1px no-repeat; /* _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='//img14.360buyimg.com/cms/g12/M00/08/1A/rBEQYFGcNxMIAAAAAAAEI72F9qMAABuQgElqvkAAAST280.png'); _background-image:none;*/}
.userjGoodsRecommend .jDesc a{color:#fff;}
.userjGoodsRecommend .jDesc a:hover{text-decoration:underline;}
.userjGoodsRecommend .jPrice{height:19px; overflow:hidden; padding-top:3px; overflow:hidden;}
.userjGoodsRecommend .jPrice span{float:left;}
.userjGoodsRecommend .jPrice .jdNumNo{font-size:12px;}
.userjGoodsRecommend .jPrice .jsNumNo{text-decoration:none; font-size:12px;}
.userjGoodsRecommend .jdPrice{color:#fcff00; font-size:12px; font-weight:bold; padding-left:15px; background:url(//img12.360buyimg.com/cms/g12/M00/08/1A/rBEQYFGcNxgIAAAAAAAEJUzJT-cAABuQgElvksAAATE254.png) 1px no-repeat; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( enabled='true', sizingMethod='scale', src='//img12.360buyimg.com/cms/g12/M00/08/1A/rBEQYFGcNxgIAAAAAAAEJUzJT-cAABuQgElvksAAATE254.png'); _background-image:none; overflow:hidden;}
.userjGoodsRecommend .jdPrice .jText{}
.userjGoodsRecommend .jdPrice .jRmb{}
.userjGoodsRecommend .jdPrice .jdNum{}
.userjGoodsRecommend .jSalePrice{float:right; overflow:hidden; color:#999; text-decoration:line-through;}
.userjGoodsRecommend .jSalePrice .jText{text-decoration:line-through;}
.userjGoodsRecommend .jSalePrice .jRmb{text-decoration:line-through;}
.userjGoodsRecommend .jSalePrice .jsNum{text-decoration:line-through;}