首页 > 解决方案 > 滑块表现得很奇怪

问题描述

   <div style="position:relative;top:0;left:0;width:100%;height:100%;overflow:hidden;">
        <div id="jssor_1" style="position:relative;margin:0 auto;top:0px;left:0px;width:1366px;height:768px;overflow:hidden;visibility:hidden;">
            <!-- Loading Screen -->
            <div data-u="loading" style="position:absolute;top:0px;left:0px;width:100%;height:100%;text-align:center;background-position:50% 50%;background-repeat:no-repeat;background-image:url('img/puff-x.svg');background-color:rgba(0, 0, 0, 0.7);background-size:20px 20px;"></div>
            <div data-u="slides" style="cursor:default;position:relative;top:0px;left:0px;width:1366px;height:768px;overflow:hidden;">
                <div data-fillmode="0" data-p="1067">
                    <img data-u="image" src="images/2109.jpg" />
                    <div data-to="50% 50%" data-ts="preserve-3d" data-t="0" style="left:-944px;top:376px;width:3000px;height:220px;position:absolute;">
                        <div data-to="50% 50%" data-t="1" style="left:2200px;top:0px;width:1200px;height:220px;position:absolute;">
                            <div style="left:0px;top:0px;width:1200px;height:110px;position:absolute;color:#f5f5f5;font-family:'Bebas Neue',cursive;font-size:84px;font-style:italic;line-height:1.2;text-align:left;background-color:rgba(0,0,0,0);">MOUNTAIN IS BIG FOR fghdfdghdfTHIS WORLD</div>
                        </div>
                    </div>
                </div>
                <div data-fillmode="0" data-p="1067">
                    <img data-u="image" src="images/dark_wallpaper.jpg" />
                    <div data-to="50% 50%" data-ts="preserve-3d" data-t="2" style="left:-944px;top:376px;width:3000px;height:220px;position:absolute;">
                        <div data-to="50% 50%" data-t="3" style="left:2200px;top:0px;width:1200px;height:220px;position:absolute;">
                            <div style="left:0px;top:0px;width:1200px;height:110px;position:absolute;color:#f5f5f5;font-family:'Bebas Neue',cursive;font-size:84px;font-style:italic;line-height:1.2;text-align:left;background-color:rgba(0,0,0,0);">SAD POEPLE ALWAYS BE LONLY</div>
                        </div>
                    </div>
                </div>
                <div data-fillmode="0" style="background-color:#141414;" data-p="1067">
                    <img data-u="image" src="images/sadge.jpg" />
                    <div data-to="50% 50%" data-ts="preserve-3d" data-t="4" style="left:-944px;top:376px;width:3000px;height:220px;position:absolute;">
                        <div data-to="50% 50%" data-t="5" style="left:2200px;top:0px;width:1200px;height:220px;position:absolute;">
                            <div style="left:0px;top:0px;width:1200px;height:110px;position:absolute;color:#f5f5f5;font-family:'Bebas Neue',cursive;font-size:84px;font-style:italic;line-height:1.2;text-align:left;background-color:rgba(0,0,0,0);">LONLY POEPLE CRY FOR POEPLE</div>
                        </div>
                    </div>
                </div>
            </div><a data-scale="0" href="https://www.jssor.com" style="display:none;position:absolute;">web animation</a>
        </div>
    </div>

我从 jssor 设计了一个滑块。当我将滑块集成到我的网站时,它的行为非常奇怪。(1366x768) 当我打开页面时,它占据了页面的一半。当我玩弄窗口时,也就是说,当我将它缩小一点时,它会调整到正常大小。

标签: javascripthtmlcssslider

解决方案


推荐阅读