<p >                        <ul >                            <li >                                <p >今天</p>                                <p >                                    <p><img src="../../dist/img/changeSunny.png" alt="" /></p>                                </p>                                <p >                                    <p>21 ~ 15 ℃</p>                                    <p>1.01325 bar</p>                                </p>                            </li>                            <li >                                <p >明天</p>                                <p >                                    <p><img src="../../dist/img/sunny.png" alt="" /></p>                                </p>                                <p >                                    <p>21 ~ 15 ℃</p>                                    <p>1.01325 bar</p>                                </p>                            </li>                            <li >                                <p >后天</p>                                <p >                                    <p><img src="../../dist/img/cloudy.png" alt="" /></p>                                </p>                                <p >                                    <p>21 ~ 15 ℃</p>                                    <p>1.01325 bar</p>                                </p>                            </li>                            <li >                                <p >7/8日</p>                                <p >                                    <p><img src="../../dist/img/rain.png" alt="" /></p>                                </p>                                <p >                                    <p>21 ~ 15 ℃</p>                                    <p>1.01325 bar</p>                                </p>                            </li>                            <li >                                <p >7/9日</p>                                <p >                                    <p><img src="../../dist/img/snow.png" alt="" /></p>                                </p>                                <p >                                    <p>21 ~ 15 ℃</p>                                    <p>1.01325 bar</p>                                </p>                            </li>                            <li >                                <p >7/10日</p>                                <p >                                    <p><img src="../../dist/img/rain.png" alt="" /></p>                                </p>                                <p >                                    <p>21 ~ 15 ℃</p>                                    <p>1.01325 bar</p>                                </p>                            </li>                        </ul>                    </p>

.weather-box{border:1px solid #5575a7;margin-bottom:10px;height:66px;overflow:hidden;}.weather-box-li{background:#485973;border-right:1px solid #5575a7;padding:0;}.weather-box-li:nth-child(3n){}.weather-ul li { float:left; width:33%; background:#485973;border-right:1px solid #5575a7;}.weather-ul li:nth-child(2) {width:34%;}.whether-time{color:#fff;font-size:25px;height:66px;line-height:66px;margin-right:15px;margin-left:15px;}.whether-logo{margin-right:15px;}.whether-logo>p{height:66px;display:table-cell;vertical-align:middle;}.whether-logo img{width:55px;}.weather-infor{color:#00ffff;font-size:22px;}

 <script src="../../plugins/jQuery/jQuery-2.1.4.min.js"></script> <script src="../../dist/js/jquery.SuperSlide.js"></script> <script type="text/javascript">      jQuery(".weather-box").slide( {mainCell:".weather-ul",effect:"leftLoop",vis:3,scroll:1,autoPlay:true} ); </script>

注意:.weather-box-li 不能设置padding值,会导致滚动异常。

此插件也支持表格向上不停滚动,但是需要把表格放到li里面

<p  style="height:300px;overflow:hidden;border-bottom:1px solid #ccc;">    <ul >        <li>            <table >                <tbody>                    <tr>                        <td ><span >1</span></td>                        <th >行业名称1</th>                        <td >昆山</td>                        <td >50</td>                        <td >20</td>                        <td >30</td>                    </tr>                    <tr>                        <td><span >2</span></td>                        <th>行业名称1行业名称1行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >3</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >4</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >5</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >6</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >7</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >8</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >9</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >10</span></td>                        <th>行业名称1</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >1</span></td>                        <th>行业名称2</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >2</span></td>                        <th>行业名称2</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >3</span></td>                        <th>行业名称2</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >4</span></td>                        <th>行业名称2</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                    <tr>                        <td><span >5</span></td>                        <th>行业名称2</th>                        <td>昆山</td>                        <td>50</td>                        <td>20</td>                        <td>30</td>                    </tr>                </tbody>            </table>        </li>    </ul></p>

jQuery(".outscrollp").slide({ mainCell: ".shuchaguanliTab", effect: "topMarquee", vis: 1, interTime: 40, autoPlay: true });

(adsbygoogle = window.adsbygoogle || []).push({});