实现到PHP时,滚动到顶部按钮将不起作用

时间:2017-08-22 10:18:53

标签: javascript jquery html

我绝不是网络开发者,所以请原谅我,如果我错过了一些明显的东西。我试图将滚动条回到顶部按钮从this awesome guy到我的静态HTML网站,当我分成两部分放入我的Realm.init(Parent.this); RealmConfiguration realmConfiguration = new RealmConfiguration.Builder() .name(AppConstants.DATABASE_NAME) .schemaVersion(2) // .migration(new DBMigration()) // .migration(new Migration()) .deleteRealmIfMigrationNeeded() .build(); Realm.setDefaultConfiguration(realmConfiguration); Realm.getInstance(realmConfiguration);

时,它会完美运行
<head>

其余的都在<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <div class='thetop'></div>

<footer>

因此,当我尝试将此实现到我的PHP中时,我仍然将其分为两部分。一个用于header.php和一个footer.php,就像静态站点一样,但我的本地站点和实时站点都没有显示任何内容。我还将按钮css添加到我的css文件中。

我的header.php

<div class='scrolltop'>
    <div class='scroll icon'><i class="fa fa-4x fa-angle-up"></i></div>
</div>
<script>
$(window).scroll(function() {
    if ($(this).scrollTop() > 50 ) {
        $('.scrolltop:hidden').stop(true, true).fadeIn();
    } else {
        $('.scrolltop').stop(true, true).fadeOut();
    }
});
$(function(){$(".scroll").click(function(){$("html,body").animate({scrollTop:$(".thetop").offset().top},"1000");return false})})
</script>

我的footer.php

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title><?php bloginfo('title'); ?></title>
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<div class='thetop'></div>
<?php wp_head(); ?>
</head>

然后我考虑将它们添加到我的index.php并从header.php和footer.php中删除它们但它仍然无法正常工作。

任何指针都会受到赞赏。

2 个答案:

答案 0 :(得分:1)

<div class='thetop'></div>放在<head> <{1}}

之后

答案 1 :(得分:0)

您应该在jQuery之后执行此类操作并准备文档。

$(document).ready(function() {
  $(window).scroll(function() {
    if ($(this).scrollTop() > 50) {
      $('.scrolltop:hidden').stop(true, true).fadeIn();
    } else {
      $('.scrolltop').stop(true, true).fadeOut();
    }
  });
  $(function() {
    $(".scroll").click(function() {
      $("html,body").animate({
        scrollTop: $(".thetop").offset().top
      }, "1000");
      return false
    })
  })
});