带有下一个上一个图标的滑动框幻灯片

Question

我使用的是 swipebox，它既简单又实用。 在demo 中有所有幻灯片图像，当单击任何图像时它会显示幻灯片。

我想破坏点击，我想在第一次默认时显示幻灯片。

我将显示带有下一个图标的第一张图片。当用户点击滑动下一张图片幻灯片将显示下一张图片。我需要的设计在这里

我修改了photoswipe.js

我变了

$(document).on('click', selector, function (event) {

与

$(document).on('Load', selector, function (event) {

但它不起作用 任何解决方法？

我不想要幻灯片的全屏透明背景。 我只想显示一个带有下一个和上一个图标的图像。当用户单击下一个和上一个时，它会显示下一个上一个图像。

这是我的视图代码

<script type="text/javascript">
    $(document).ready(function () {
        $('.swipebox').swipebox();
    });
</script>

<div class="content">
    <div class="display-img" style="overflow: hidden; text-align: center;">

                foreach (var item in Model.Images.Take(8))
        {

                <a rel="gallery-1" href="@item.Url" class="swipebox" >
                <img src="@item.ThumbnailUrl" alt="image" style="width:22%;height:35%;">
            </a> 



        }
        <div class="specifications">
            @if (ViewBag.Culture == "tr")
            {
                <img src="~/Content/images/display_foot_bg.png" width="280" />

            }
            else
            {
                <img src="~/Content/images/display_foot_bg2.png" width="280" />
            }
        </div>

编辑： darren sweeney 回答我

我添加了这段代码来查看

<script type="text/javascript">
    $(document).ready(function () {
        $('.swipebox').swipebox();
        $('.swipebox:first').click();
         // simply faking a click on the selector which starts the slide

    });
</script>

它不起作用。不点击它显示幻灯片的任何图像。

但我需要这样的页面：http://i.stack.imgur.com/xBWMO.png 不喜欢这样

因为我的页面中有信息内容链接和其他html控件。幻灯片只是我的移动网站页面的一部分。所以我需要全屏更改幻灯片

Answer 1

初始化后就可以启动了..

Code.photoSwipe('a', '#Gallery');
Code.PhotoSwipe.Current.show(0);

UPDATE上面的忽略，最简单的选择是这样的：

<script type="text/javascript">
  $(document).ready(function () {
    $('.swipebox').swipebox();
    $(selector).click(); // simply faking a click on the selector which starts the slide
  });
</script>