Когда запускаю в codpen или plunker все работает , но когда запускаю с html файла на компе страница очень долго грузится а после загрузки неработает js
<html>
<head>
<meta charset="utf-8">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
var Droge = ["Iburofen 200", "Iburofen400","Iburofen Gel"];
$('#acInput').autocomplete({
source: Droge
})
});
</script>
<style>
.fig {
text-align: center;
}
</style>
<style>
p.dline {
line-height: 2.5;
}
P {
line-height: 1.3em;
}
</style>
<style>
#Name {
<br>
<br><br>
<br><br><br><br><br><br><br>
width:1913px;
height : 97.4px;
border-bottom: 0px solid maroon;
background-color: #DBDBDB;
text-align: left;
}
</style>
</style>
<style>
TABLE {
width:1910px;
height : 240px;
border-bottom: 0px solid maroon;
background-color: #48FF00;
}
TH {
background:#00e600;
color: white;
text-align: left;
}
TD, TH {
padding: 3px;
}
</style>
<title>Search</title>
<style>
.fig {
text-align: center;
}
}
</style>
</head>
<body>
<table cellspacing="0">
<tr>
<th><h1>PHARMACY <marquee width="300"
scrollamount="30"> Online</marquee</h1></th>
</tr>
<tr>
</table>
<div class="spoil">
<div class="sp_top">
<span class="sp_span">Iburofen</span>
<button class="sp_button">Open</button>
</div>
<div class="sp_text">
Pain is an unpleasant sensory and emotional experience associated with actual
or potential tissue damage.
* This is one of the most typical symptoms of inflammation or injury. The purpose
Pain is actually a warning to health problem / fault health.
</div>
</div>
<script>
$(document).ready(function () {
$(document).on("click", ".sp_button", function () {
spoyler(this);
});
});
function spoyler(obj) {
var spoil = $(obj).parent().parent(".spoil");
var he = spoil.find(".sp_text").innerHeight() + 60;
if (spoil.height() == 24) {
$(obj).text("Close");
spoil.stop(true).animate({ height: he + "px" }, 200);
} else {
$(obj).text("Open");
spoil.stop(true).animate({ height: 24 + "px" }, 200);
}
}
</script>
<style type="text/css">
.spoil {
position: relative;
overflow: hidden;
background: #0000FF;
border: 1px solid #c3c3c3;
border-left: 6px solid #c3c3c3;
margin: 15px 0 15px 0;
width:300px;
height: 24px;
border-collapse: collapse;
}
.spoil .sp_text {
margin: 40px 10px 10px 10px;
}
.spoil .sp_top {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 25px;
background: rgba(195, 195, 195, 0.1);
border-bottom: 1px solid #c3c3c3;
display: table;
}
.spoil .sp_span {
vertical-align: middle;
display: table-cell;
padding: 0 0 0 20px;
}
.spoil .sp_button {
position: absolute;
right: 2px;
top: 2px;
width: 100px;
height: 20px;
text-align: center;
border: 1px solid #c3c3c3;
background: #fff;
}
.spoil .sp_button:hover {
box-shadow: inset 0 0 3px #ffd800;
}
</style>
<form>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<p class="fig"><img src="header_logotip.png"
width="430" height="210" ></p>
<div style="text-align: center">
<div class="ui-widget">
<form>
<div class="ui-widget">
<input id="acInput"/>
<style="text-align: center; background-color: #ccc;"
/><input type="button" value="Go"
onclick="javascript:window.location='hederfile.html'"/>
</div>
</form>
<body bgcolor="#ffff99">
<br>
<br><br>
<br><br><br><br><br><br><br><br><br><br><br><br>
<div id="Name">
<th><br><h4>
Edward Joseph Snowden © 2016</h4></p></th>
</tr>
</div>
</body>
</html>