I have the following HTML code
<!DOCTYPE html>
<body>
<link rel = "stylesheet"
type = "text/css"
href = "stylesheet.css" />
<div id="bg"></div>
<h2>Kiran Murthy JD</h2>
<section>
<nav>
<div></div>
<ul>
<li data-xcoord="0px" class="active">About</li>
<li data-xcoord="160px">Portfolio</li>
<li data-xcoord="320px">Contact</li>
<!--<li data-xcoord="480px">Store</li>-->
</ul>
</nav>
</section>
<script type="text/javascript" src="http:///ajax.googleapis/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script type="text/javascript" src=".1.3/jquery.min.js"></script>
<script type="text/javascript" src="javas.js"></script>
</body>
And following is the js file I want to link, Filename is javas.js
$("nav ul li").click(function(){
var xcoord = $(this).data("xcoord");
$("nav div").stop().animate({marginLeft:xcoord}, 400, "easeInOutExpo");
$(this).addClass("active");
$("nav ul li").not(this).removeClass("active");
});
I also have CSS file which I am able to link successfully. But, java scripts are not linking at all. I'm not sure which js files are not linking i.e., The online js files or javas.js local file. I'm using sublime Text 3
I have the following HTML code
<!DOCTYPE html>
<body>
<link rel = "stylesheet"
type = "text/css"
href = "stylesheet.css" />
<div id="bg"></div>
<h2>Kiran Murthy JD</h2>
<section>
<nav>
<div></div>
<ul>
<li data-xcoord="0px" class="active">About</li>
<li data-xcoord="160px">Portfolio</li>
<li data-xcoord="320px">Contact</li>
<!--<li data-xcoord="480px">Store</li>-->
</ul>
</nav>
</section>
<script type="text/javascript" src="http:///ajax.googleapis./ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare./ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="javas.js"></script>
</body>
And following is the js file I want to link, Filename is javas.js
$("nav ul li").click(function(){
var xcoord = $(this).data("xcoord");
$("nav div").stop().animate({marginLeft:xcoord}, 400, "easeInOutExpo");
$(this).addClass("active");
$("nav ul li").not(this).removeClass("active");
});
I also have CSS file which I am able to link successfully. But, java scripts are not linking at all. I'm not sure which js files are not linking i.e., The online js files or javas.js local file. I'm using sublime Text 3
Share Improve this question edited May 26, 2017 at 14:28 Borja Perez 31 silver badge7 bronze badges asked May 26, 2017 at 13:13 Kiran JDKiran JD 5716 silver badges15 bronze badges 8-
jquery.min.jsmust be first in order as code in other files is dependent on jQuery . – Mohammad Usman Commented May 26, 2017 at 13:14 - @MohammadUsman tried it, No effect – Kiran JD Commented May 26, 2017 at 13:15
-
By the way, where is the
headsection in your document? – Mohammad Usman Commented May 26, 2017 at 13:17 - 2 "But, java scripts are not linking at all" — How are you establishing this? Have you used the Developer Tools in the browser? Have you checked the Network tab? Is a request being made for the JS files? Are they getting responses? Do the responses give you 200 OK statuses? What about the Console? Does it show any error messages? – Quentin Commented May 26, 2017 at 13:17
-
Use a validator, a
<link>can't go inside the<body>and the<title>is missing. – Quentin Commented May 26, 2017 at 13:18
2 Answers
Reset to default 2<!DOCTYPE html>
<head>
<link rel = "stylesheet" type = "text/css" href = "stylesheet.css" />
<script type="text/javascript" src="https://code.jquery./jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="http:///ajax.googleapis./ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="javas.js"></script>
</head>
<body>
<div id="bg"></div>
<h2>Kiran Murthy JD</h2>
<section>
<nav>
<div></div>
<ul>
<li data-xcoord="0px" class="active">About</li>
<li data-xcoord="160px">Portfolio</li>
<li data-xcoord="320px">Contact</li>
<!--<li data-xcoord="480px">Store</li>-->
</ul>
</nav>
</section>
</body>
try this it will work i guess
You should be changed scripts sequence.
<!DOCTYPE html>
<html>
<body>
<link rel = "stylesheet"
type = "text/css"
href = "stylesheet.css" />
<div id="bg"></div>
<h2>Kiran Murthy JD</h2>
<section>
<nav>
<div></div>
<ul>
<li data-xcoord="0px" class="active">About</li>
<li data-xcoord="160px">Portfolio</li>
<li data-xcoord="320px">Contact</li>
</ul>
</nav>
</section>
<script type="text/javascript" src="http://cdnjs.cloudflare./ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript" src="http:///ajax.googleapis./ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="javas.js"></script>
</body>
</html>
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745665449a4639094.html
评论列表（0条）