【问题标题】:Gallery in jQuery with listjQuery中的画廊与列表
【发布时间】:2013-03-07 20:03:51
【问题描述】:

我正在寻找一些带有上一个/下一个按钮的画廊,我找到了它。我有代码:

var speed = 0;
$('#mask-gallery, #gallery li').width($('#slider').width());    
$('#gallery').width($('#slider').width() * $('#gallery li').length);
$('#mask-gallery, #gallery li').height($('#slider').height());
$('#gallery li:first').addClass('selected');

$('#btn-next, #gallery').click(function () {
 newsscoller(0);    
 return false;
});

$('#btn-prev').click(function () {
 newsscoller(1);    
 return false;
});

function newsscoller(prev) {
    var current_image = $('#gallery li.selected').length ? $('#gallery li.selected') : $('#gallery li:first');
    if (prev) {
        var next_image = (current_image.prev().length) ? current_image.prev() : $('#gallery li:last');
    } else {
        var next_image = (current_image.next().length) ? current_image.next() : $('#gallery li:first');
    }

    $('#gallery li').removeClass('selected');
    next_image.addClass('selected');
    $('#mask-gallery').scrollTo(next_image, 250);
}

http://jsfiddle.net/R27FS/

我有一个问题。任何人都知道它的脚本如何在最后一张幻灯片之后将用户重定向到定义的页面 (location.href = '';)?

感谢回复!

【问题讨论】:

  • noooooo 永远不会在最后一张幻灯片上重定向!没有具有这种功能的画廊!而是在最后一张幻灯片上添加点击或创建按钮并使其可点击!想想用户,如果你(严重地)让他们吃惊,他们就再也不会回来了。我就是其中之一。
  • 我同意,没有人想要那样。几乎和背景音乐一样糟糕!
  • 同样,我将不胜感激一些解决方案:)

标签: jquery list redirect location gallery


【解决方案1】:

一个选项是将“下一个”链接设置为最后一张幻灯片上的实际位置。然后在click 事件上return true; href!="#"

DEMO

var speed = 0;
$('#mask-gallery, #gallery li').width($('#slider').width());
$('#gallery').width($('#slider').width() * $('#gallery li').length);
$('#mask-gallery, #gallery li').height($('#slider').height());
$('#gallery li:first').addClass('selected');

$('#btn-next, #gallery').click(function () {
    var href = $(this).attr("href");
    if (href != "#" && href != "") return true;
    newsscoller(0);
    return false;
});

$('#btn-prev').click(function () {
    newsscoller(1);
    return false;
});

function newsscoller(prev) {
    var current_image = $('#gallery li.selected').length ? $('#gallery li.selected') : $('#gallery li:first');
    var next_image;
    $("#btn-next").attr("href", "#");
    if (prev) {
        next_image = (current_image.prev().length) ? current_image.prev() : $('#gallery li:last');
    } else {
        if (current_image.next().length) {
            next_image = current_image.next();
        }
        if (!next_image.next().length) {
            $("#btn-next").attr("href", "http://www.google.com");
            //'target' required for it to work in jsFiddle b/c of 
            //iframe, remove in your code.
            $("#btn-next").attr("target", "_blank");
        }
    }

    $('#gallery li').removeClass('selected');
    next_image.addClass('selected');
    $('#mask-gallery').scrollTo(next_image, 250);
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多