仅在前一页是主页时运行jQuery

时间:2015-06-10 12:33:45

标签: jquery html css cookies

主页上主要有JSFiddle开头的CSS,我希望内页只有在主页后访问时才能动画到新的CSS类。

<div class="container">
  <div>
    Thank you for your assistance!
  </div>
</div>

<style>
.container {
    padding: 100px 0;
    background: #ccc;
    text-align: center;
}

.container div {
    background: #eaeaea;
    width: 200px;
    height: 200px;
    margin:0 auto;
    text-indent: -9999px;
}

.container.inner,
.container.inner div {
    transition: all 0.75s ease-in;
}

.container.inner {
    padding: 10px 0;
}

.container.inner div {
    width: 100px;
    height: 100px;
}
</style>
<script>
jQuery( document ).ready(function() {
    setTimeout(function() {
        if ( jQuery(".home").length == 0  ) {
            jQuery('.container').addClass('inner');
        }
    }, 500 );
});
</script>

我想我需要使用一两个cookie来确定前一页是否是主页,而另一个是使用CSS而不延迟或动画如果前一页是内页。

2 个答案:

答案 0 :(得分:1)

document.referrer是您想要查看的内容:

if(document.referrer.indexOf('home')){
   // apply the addClass here then.
}

注意:
document.referrer仅保留访问的最后一页。

答案 1 :(得分:0)

我最终使用PHP来确定文档引用者。谢谢@Jai指出我正确的方向。我将jQuery更改为单独的文件中的jQuery,只要引用者是“index.php”或“/”,我就会调用该js文件

这是我使用的确切代码(在WordPress functions.php上)

$homePagePaths = array (
  '/index.php',
  '/'
);

$parts = parse_url($_SERVER['HTTP_REFERER']);
if (empty($parts['path']) || in_array($parts['path'], $homePagePaths)) 
  wp_enqueue_script( 'inner-animation', 
  get_stylesheet_directory_uri() . '/js/inner-animation.js', 
  array('jquery'), '', true )
;