Question

我想基于两件事情将滑块更改为某个幻灯片/图像：

网址
点击的标签

如果有人通过../tabs/#contact访问该网站，则滑块需要滑动到第二张图片。

如果有人通过../tabs/#about访问该网站，则滑块需要滑动到第一张图片。

同样需要发生的是有人点击标签。

如果有人点击“关于”标签，滑块将滑动到第一张幻灯片，或者如果他们点击“联系人”标签，则会滑动到第二张图片。

基本上，我的截止日期很紧。我需要知道是否有人之前做过这样的事情，以及最快捷的方法是什么！

去年我编写了一个类似的脚本，根据URL的内容或点击带有哈希标记的链接加载动态内容。但是，我没有足够的时间为这个项目编写类似的复杂脚本！有没有一种简单的方法来做我上面描述的事情！

        //load data when the link is clicked

function loadProfile() {
$('.profileID').each(function() {
        var fp = $(this).html().toLowerCase().replace(/\s/g,"-").replace("\'","") + "-card";
        /*alert(fp);*/
        $.get("ag-cms.php?fakeParameter=" + fp, function(data) {
            var cardID = this.url.replace("ag-cms.php?fakeParameter=", "");
            var card = $("#" + cardID, data).html();
            $(".profileID:not(:has(div)):eq(0)").html(card);
            $(".extraInfo").hide(); 
        });
    });
}

$(document).ready(function(){

$("a").live('click', function() {

var titleTarget = $(this).attr("title");
document.title = 'Albert Goodman - Chartered Accountants - ' + titleTarget;   
$('#loader').html("<strong>Loading</strong> - " + titleTarget);
$('.dynamicContent, .sideBar').fadeOut("fast", function() {
$('#loader').fadeIn("fast");
});

if ($(this).attr("href").indexOf("#") != -1){
var target = $(this).attr("href");      
$('#dynamicContent').load('ag-cms.php ' + target, function() {
$('#loader').hide();
$('.contactInfoBox').load('ag-cms.php #allProfiles p' );    
loadProfile();
});
};

$(window).hashchange();
});});

//load data when page loads

var ahash;
$(window).load(function () {

ahash = location.hash;
$.get('../ag-cms.php?ref='+ahash, function(data) { 

if( $(ahash, data).length == 0 && ahash != "") { 
$('#dynamicContent').load('ag-cms.php #error', function() { 
$('#error #message').append("The link <strong>" + ahash + "</strong> is not valid");
$('#loader').hide();
});}

else if( ahash != ""){ 
$('#dynamicContent').load('ag-cms.php ' + ahash, function() {
$('#loader').hide();
$('.contactInfoBox').load('ag-cms.php #allProfiles p' );
loadProfile();
});
}

else {
$('#dynamicContent').load('ag-cms.php #home', function() {
$('#theNews').load('news.php .titleBrief' );
$('#theEvents').load('events.php .titleBrief' );
$('#loader').hide();
});
};
});
});

Answer 1

您是否尝试过访问引荐来获取地址？ document.referrer和标签我认为你可以有一个onclick事件，它传递标签ID，然后在滑块中选择适当的部分..

Answer 2

就像@Juhana一样，我很好奇你到底遇到了什么问题，就像@Aleks一样，我也很好奇你到目前为止尝试了什么？

您需要做的就是检查页面加载时的哈希值，如果设置了一个哈希值，并且选项卡中有一个指向哈希值的链接，则单击该链接（使用jQuery的click()）。您需要做的第二件事是，在单击选项卡时，还可以单击滑块链接（div.slidecontrolls a）。

基本上类似于：

// Get all the tabs
var tabs = jQuery('#wp-tabs-1').find('li a');

// When clicking a tab
tabs.click(function () {
    // Find out which tab was clicked
    var which = tabs.index(this);

    // Click the corresponding link in the slider
    jQuery('div.slidecontrolls').find('a').eq(which).click();
});

// If there's a link in the tabs pointing to the current hash - click it
var hash    = window.location.hash;
var hashTab = tabs.filter('[href="' + hash + '"]');

if (hashTab.length) {
    hashTab.click();
}

编辑：如果设置了哈希，您的标签插件会点击相应的标签，您可以将hashTab.click()更改为jQuery('div.slidecontrolls').find('a').eq(tabs.index(hashTab)).click()，只需点击滑块链接。

根据URL哈希或选项卡选择滑动到图像

2 个答案: