0
私は、コードを少しアップneatenために私のHTMLに、いくつかのdivの周りに移動し、私は古いファイルをバックアップし、古いファイルを上書きし、私のFTPに直接保存されませんでした。今jQueryのウェブサイトのヘッダーの問題
それはあなたが（だけ大きな画面上の）ページの先頭へ行かせる150ピクセルあなたが過去を下にスクロールします。私はどのように修正するか、または私が間違っていたことはかなりわかりませんが、どんな助けも素晴らしいでしょう！ （サイズを削減するメインコンテンツなし）
HTML：
<!DOCTYPE html>
<html>
<head>
<title>ItzJavaCraft | ModPE Members</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css" rel="stylesheet">
<link href="/assets/css/stylesheet.css" rel="stylesheet">
<link rel="stylesheet" href="https://npmcdn.com/[email protected]/css/tachyons.min.css">
<link href="http://fonts.googleapis.com/css?family=Cookie" rel="stylesheet" type="text/css">
<link href='https://fonts.googleapis.com/css?family=Actor' rel='stylesheet' type='text/css'>
<link href="/assets/images/icon.png" rel="icon" type="image/png">
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<header class="header-fixed">
<div class="header-limiter">
<h1><a href="http://itzjavacraft.tk">ItzJavaCraft</a></h1>
<nav>
<a href="http://itzjavacraft.tk" class="selected">Home</a>
<a href="http://itzjavacraft.tk/blog">Blog</a>
<a href="http://itzjavacraft.tk/tutorials">Tutorials</a>
<a href="http://itzjavacraft.tk/news">News</a>
<a href="http://itzjavacraft.tk/contact">Contact</a>
<a href="http://itzjavacraft.tk/about">About</a>
</nav>
</div>
</header>
<div class="header-fixed-placeholder">
</div>
<div class="wrap">
<div class="main">
</div>
</div>
<footer class="footer-distributed">
<div class="footer-left">
<h3>ItzJavaCraft</h3>
<p class="footer-links">
<a href="#">Home</a>
»
<a href="#">Blog</a>
»
<a href="#">Pricing</a>
»
<a href="#">About</a>
»
<a href="#">Faq</a>
»
<a href="#">Contact</a>
</p>
<p class="footer-company-name">Copyright © 2016 <b>ItzJavaCraft</b>, All Rights Reserved</p>
</div>
<div class="footer-center">
<div>
<i class="fa fa-envelope"></i>
<p><a href="mailto:[email protected]">[email protected]</a></p>
</div>
</div>
<div class="footer-right">
<p class="footer-company-about"><span>Oh, hello there...</span>My name is Java. No, not the programming language! Well, this is awkward. Not much else to be said... uhm... enjoy your stay, I guess!</p>
<div class="footer-icons">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="http://twitter.com/itzjavacraft"><i class="fa fa-twitter"></i></a>
<a href="http://instagram.com/itzjavacraft"><i class="fa fa-instagram"></i></a>
<a href="https://plus.google.com/u/3/100627374146825887109" target="_blank"><i class="fa fa-google-plus"></i></a>
</div>
</div>
</footer>
<div class="menu">
<script>
$(document).ready(function(){
var showHeaderAt = 150;
var win = $(window),
body = $("body");
if(win.width() > 600){
win.on("scroll", function(e){
if(win.scrollTop() > showHeaderAt) {
body.addClass("fixed");
}
else {
body.removeClass("fixed");
}
});
}
});
</script>
</div>
</body>
</html>
のjQuery：
$(document).ready(function(){
var showHeaderAt = 150;
var win = $(window),
body = $("body");
if(win.width() > 600){
win.on("scroll", function(e){
if(win.scrollTop() > showHeaderAt) {
body.addClass("fixed");
}
else {
body.removeClass("fixed");
}
});
}
});
注：私はdiv要素の周りに移動する前に、それがうまく働いていました。
サイトのライブバージョンはhere、JSFiddleはフィドルがhereです。
あなたのライブバージョンは今とてもライブではありません。 –
@MikelisBaltruksはい、そうです。正直なところ、そのリンクは完全に白いページを開きます。 – ItzJavaCraft
奇妙だ –