javascript - ResponsiveSlides 如何让图片的宽度占据整个页面？

Question

我想让图像的宽度像这样占据整个页面：

http://i1240.photobucket.com/albums/gg491/Nerio_Navea/Screenshots/GoogleChrome2014-12-30220149_zps99e94bc2.png

但我找不到这个属性。

我是使用 Jquery 的新手，但我了解 Javascript

请有人帮我解决这个问题

我是 StackOverflow 的新手

对不起我的英语;D

Answer 1

我不知道您到底想要什么，但您可以将图像插入 adiv或使用float，以便您的图像可以超出正常边距。

以下是您可以尝试的方法（使用内联 CSS）：

<image src = " " style = "position: absolute; left:10; top: 100;">

只需通过在各自位置写入左侧和顶部坐标来指定要放置图像的确切位置。这是我读完你的问题后得到的。

而且，这样你可以让你的图像甚至占据整个页面。

Answer 2

如果您正在尝试制作响应式幻灯片，这可能会有所帮助。这是一个使用 Javascript/HTML 在滑块中包含幻灯片的示例。

1. Javascript代码

<!-- it works the same with all jquery version from 1.x to 2.x -->
<script src="jquery.min.js"></script>
<script src="jssor.slider.mini.js"></script>
<script>
    jQuery(document).ready(function ($) {
        //Define an array of slideshow transition code
        var _SlideshowTransitions = [
        { code1 },
        { code2 },
        { code3 }
        ];
        var options = {
            $AutoPlay: true,
            $SlideshowOptions: {
                    $Class: $JssorSlideshowRunner$,
                    $Transitions: _SlideshowTransitions,
                    $TransitionsOrder: 1,
                    $ShowLink: true
                }
        };
        var jssor_slider1 = new $JssorSlider$('slider1_container', options);
    });
</script>

2. HTML 代码

<div id="slider1_container" style="position: relative; top: 0px; left: 0px; width: 600px; height: 300px;">
    <!-- Slides Container -->
    <div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 600px; height: 300px;">
        <div><img u="image" src="image1.jpg" /></div>
        <div><img u="image" src="image2.jpg" /></div>
    </div>
</div>