文章/答案/技术大牛

发布

社区首页 >问答首页 >将布局与URL匹配时出现问题

问将布局与URL匹配时出现问题
EN

Stack Overflow用户

提问于 2013-07-12 21:02:57

回答 2查看 73关注 0票数 2

我正在做一个小项目，我有一个问题。我正在工作的网站结构是这样的：

网站的所有部分都在同一文档中，布局上的蓝色部分是菜单，数字改变了1 2 3 div的位置(使用jQuery)，将所选部分移动到中心，将其他部分从布局中移出。

    $("li").click(function() {
    var selectedText = $(this).text();
    $(this).addClass("active");
    $(this).siblings().removeClass("active");
    if (selectedText == "Upload") {
        $('#homePage').animate({
            left: 2000
        }, 1000);
        $('#upload').animate({
            left: 105
        }, 1000);
        $('#explore').animate({
            left: 2000
        }, 1000);

    }
    if (selectedText == "Gallery") {
        $('#homePage').animate({
            left: 0
        }, 1000);
        $('#upload').animate({
            left: -2000
        }, 1000);
        $('#explore').animate({
            left: 2000
        }, 1000);

    }
    if (selectedText == "Explore") {
        $('#homePage').animate({
            left: -2000
        }, 1000);
        $('#upload').animate({
            left: -4000
        }, 1000);
        $('#explore').animate({
            left: -2000
        }, 1000);

    }
});

我现在需要做的是适当地改变网站的网址，因为我改变了部分，我希望能够得到适当的部分的网址。我尝试了location.hash方法，但当我更改hashtag值时，滑动的jquery动画错误地移动了div(使用这里发布的相同代码，将"var div“作为散列值)……我正在寻找一个解决方案，我找到了HTML5 pushState，但我真的不知道如何在我的例子中使用它，因为我没有任何AJAX请求或任何东西。感谢大家！

pushstate

php

javascript

jquery

html

回答 2

Stack Overflow用户

发布于 2013-07-12 21:14:47

来获取URI。

document.documentURI

为了得到这一部分。

var URI = document.documentURI;
var section = URI.substring( URI.lastIndexOf('/') + 1 ).replace('.html', '');

这将从www.xy.com/foo.html返回foo

希望我没弄错你的问题。

票数 0

Stack Overflow用户

发布于 2013-07-15 21:01:20

我用GET变量和下面的代码解决了这个问题：

    $class="gallery";
if (isset($_GET['p'])){
    $p = $_GET['p'];
    if($p == "explore"){
        $headerActive = $userIsLoggedIn ? 0 : 2;
        $class="explore";
    }
    if($p == "gallery"){
        $headerActive = $userIsLoggedIn ? 0 : 1;
        $class="gallery";
    }
    if($p == "upload"){
        $headerActive = $userIsLoggedIn ? 0 : 0;
        $class="upload";
    }
}

索引上是这样的：

<div id="center" style="overflow-x: hidden">
            <div id="content" class="initial-<?= $class?>">
                <?php if($userIsLoggedIn): ?>
                    <? require('templates/submit_form.php') ?>  
                <?php else: ?>
                <div id="uploadform">
                <? require('signin_form.php') ?>
                </div>

                <?php endif; ?>


                <? require('templates/stickers.php'); ?>
                <? require('templates/explore.php'); ?>
            </div>
        </div>

CSS要使其工作：

#content.initial-gallery #upload {
    left: -2000px;
}

#content.initial-gallery #homePage {
    left: 0px;
}
#content.initial-gallery #explore {
    left: 2000px;
}

#content.initial-upload #upload {
    left: 105px;
}

#content.initial-upload #homePage {
    left: 2000px;
}
#content.initial-upload #explore {
    left: 4000px;
}
#content.initial-explore #upload {
    left: -4000px;
}

#content.initial-explore #homePage {
    left: -2000px;
}
#content.initial-explore #explore {
    left: -2000px;
}

无论如何，感谢所有人！

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/17615560

复制

相似问题

问将布局与URL匹配时出现问题
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将布局与URL匹配时出现问题EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问将布局与URL匹配时出现问题
EN