3
Итак, мой jQuery ничего не делает, даже если я делаю это с apache или когда я его открываю нормально. (Chrome)jQuery не работает с моим HTML вообще?
Я связал его в HTML, который связан с моим CSS, но он ничего не делает. Не совсем уверен, если это потому, что я не связывал его правильно или что-то в этом роде. Вот мой код: (Бонусный вопрос: почему нет списка на странице результатов турнира?)
Спасибо большое, ребята!
home.html:
<!DOCTYPE html>
<html>
<head>
<title>Niki Stoiber</title>
<script type='text/javascript' src='http://localhost/Niki/script.js'></script>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
</head>
<body>
<div id="navbar">
<ul>
<a href="Home.html"><li class="pull-me">Home</li></a>
<a href="AboutMe.html"><li class="pull-me">About Me</li></a>
<a href="Tournaments.html"><li class="pull-me">Tournament Results</li></a>
<a href=""><li class="pull-me">Social Networks</li></a>
</ul>
</div>
<br>
<br>
<div id="title">
<h1 align="center">Niki Stoiber</h1>
</div>
<p>Hey there, my name is Niki Stoiber, and this is my Webpage!</p>
<p>I am a 9 year old boy from Austria and I want to be a professional tennisplayer someday.</p>
</body>
</html>
AboutMe.html:
<!DOCTYPE html>
<html>
<head>
<title>Niki Stoiber</title>
<script type='text/javascript' src='script.js'></script>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
</head>
<body>
<div id="navbar">
<ul>
<a href="Home.html"><li class="pull-me">Home</li></a>
<a href="AboutMe.html"><li class="pull-me">About Me</li></a>
<a href="Tournaments.html"><li class="pull-me">Tournament Results</li></a>
<a href=""><li class="pull-me">Social Networks</li></a>
</ul>
</div>
<br>
<br>
<div id="title">
<h1 align="center">About Me</h1>
</div>
<div align="center">
<p>
Age: 9 <br>
Birthday: 14.4.2003 <br>
Tennis Club I play for: <a href="http://better-tennis.at"> Better Tennis <br>
<img src="http://bit.ly/WpoXB1"/></a>
</p>
</div>
</body>
</html>
Tournaments.html:
<!DOCTYPE html>
<html>
<head>
<title>Niki Stoiber</title>
<script type='text/javascript' src='script.js'></script>
<link rel='stylesheet' type='text/css' href='stylesheet.css'/>
</head>
<body>
<div id="navbar">
<ul>
<a href="Home.html"><li class="pull-me">Home</li></a>
<a href="AboutMe.html"><li class="pull-me">About Me</li></a>
<a href="Tournaments.html"><li class="pull-me">Tournament Results</li></a>
<a href=""><li class="pull-me">Social Networks</li></a>
</ul>
</div>
<br>
<br>
<div id="title">
<h1 align="center">Tournament Results</h1>
</div>
<div id="navbar">
<ul>
<li>
Anif, Salzburg: 9. Platz
</li>
<li>
Goetzis, Vorarlberg: 1. Platz
</li>
<li>
Imst, Tirol: 2. Platz
</li>
</ul>
</div>
</body>
</html>
stylesheet.css:
* {
width:auto;
height:auto;
background-color:#D3D3D3;
font-family:"Lintel", sans-serif;
}
@font-face {
font-family: "Lintel";
src: url("./Lintel.ttf") format("truetype");
}
#navbar {
position:fixed;
left:50%;
margin-left:-254px;
}
ul {
vertical-align:auto;
list-style-type:none;
position:fixed;
margin:-5px;
text-align:center;
}
.AboutMe {
font-family:"Lintel", Sans-serif;
}
ul a li {
background-color:#2F4F4F;
color:#FFFFFF;
border-radius:5px 5px;
border:solid black;
font-family:"Lintel", Sans-serif;
display:inline;
padding:5px;
z-index:1;
opacity: 0.5;
}
#title {
z-index:2;
}
a:link {
text-decoration:none;
color:black;
}
a:visited {
text-decoration:none;
color:black;
}
a:focus {
text-decoration:none;
color:black;
}
a:hover {
text-decoration:none;
color:black;
}
a:activ {
text-decoration:none;
color:black;
}
h1 {
text-align:center;
position:relative;
}
p {
text-align:center;
position:relative;
}
script.js:
$(document).ready(function() {
$('a').mouseenter(function(){
$(this).fadeTo('slow', 1);
});
$('a').mouseleave(function() {
$(this).fadeTo('slow', 0.5)
})
});
Вы должны ссылаться на библиотеку JQuery - https://developers.google.com/speed/libraries/devguide – tymeJV
Вы действительно ссылались на jquery со своих страниц? просто добавьте это в свои заголовки: – Youssef
Btw лучший дополнительный совет для использования .. http : //html5boilerplate.com/ well build framework для всей вашей разметки ... Поместите скрипты внизу и используйте правильные метатеги и т. д. И как @tymeJV говорит ref jquery lib –