jScrollPane CSS не работает
Добрый день! Я пытаюсь использовать jScrollPane и полоса прокрутки не появляется. Я раньше пользовалась webkit но я удалил все это в моем css файл и использовал это вместо. Это мой сырой код:
@(user: String, content: String)
@import helper._
@import helper.twitterBootstrap._
@title = {}
<link rel="stylesheet" href="/assets/stylesheets/jquery-ui.css">
<script src="/assets/javascripts/jquery-1.10.2.js"></script>
<script src="/assets/javascripts/jquery-ui-1.10.4.js"></script>
<script src='/assets/javascripts/jquery-1.7.1.min.js' type="text/javascript"></script>
<link type="text/css" href="style/jquery.jscrollpane.css" rel="stylesheet" media="all" />
<script type="text/javascript" src="//jscrollpane.kelvinluck.com/script/jquery.mousewheel.js"></script>
<script type="text/javascript" src="//jscrollpane.kelvinluck.com/script/jquery.jscrollpane.min.js"></script>
<script>
$(function()
{
$('.adjust').jScrollPane();
});
</script>
@main(title, nav = "log") {
<p align='right'> Logged in as: <b>@user</b> </p>
<h3> Log Information!</h3> <br>
<div class="adjust">
<pre>@content</pre>
</div>
}
и это источник страницы
<link rel="stylesheet" href="/assets/stylesheets/jquery-ui.css">
<script src="/assets/javascripts/jquery-1.10.2.js"></script>
<script src="/assets/javascripts/jquery-ui-1.10.4.js"></script>
<script src='/assets/javascripts/jquery-1.7.1.min.js' type="text/javascript"></script>
<link type="text/css" href="style/jquery.jscrollpane.css" rel="stylesheet" media="all" />
<script type="text/javascript" src="//jscrollpane.kelvinluck.com/script/jquery.mousewheel.js"></script>
<script type="text/javascript" src="//jscrollpane.kelvinluck.com/script/jquery.jscrollpane.min.js"></script>
<script>
$(function()
{
$('.adjust').jScrollPane();
});
</script>
<!DOCTYPE html>
<html>
<head>
<title>Impact Analysis Knowledge Management Tool</title>
<link rel="stylesheet" media="screen" href="/assets/stylesheets/bootstrap.css">
<link rel="stylesheet" media="screen" href="/assets/stylesheets/main.css">
<link rel="shortcut icon" type="image/png" href="/assets/images/favicon.png">
<link href='/assets/stylesheets/css/ui-lightness/jquery-ui-1.10.4.css' rel="stylesheet">
<script src='/assets/javascripts/jquery-ui-1.10.4.js'></script>
</head>
<body>
<div class="topbar">
<div class="fill">
<div class="container">
<a class="brand" href="/index">Home</a>
<ul class="nav">
<li class="">
<a href="/addTag">Add Tag</a>
</li>
<li class="">
<a href="/tags/viewTags">View/Edit Tag</a>
</li>
<li class="active">
<a href="/logging">Log Information</a>
</li>
<li class="">
<a href="/tree">Web Map</a>
</li>
<li class="">
<a href="/help"> <img src='/assets/images/help.png' style="width: 1.5em; height: 1.5em;"/> </a>
</li>
</ul>
<p align="right"> <a href="/logout">Log-out</a> </p>
</div>
</div>
</div>
<div id="loader" class="left">
</div>
<div class="container">
<div class="content">
<div class="row">
<div class="span14">
<p align='right'> Logged in as: <b>user1</b> </p>
<h3> Log Info</h3> <br>
<div class="adjust">
<pre> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Curabitur eu erat ut ante interdum pretium vel at felis.
Duis ac eros quis urna pharetra tincidunt eu sit amet massa.
Ut a felis fringilla, fringilla lacus ut, suscipit neque.
Sed elit nulla, hendrerit nec congue sed, ullamcorper nec ligula.
Cras mi metus, rutrum at turpis quis, luctus consectetur massa.
Quisque pharetra ac magna quis pellentesque.
Nam commodo lobortis felis, quis convallis nibh consectetur in.
Sed rutrum porta odio, id varius dui congue id.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Quisque commodo, dolor eu gravida semper, eros quam hendrerit turpis, eget vehicula eros felis eget nisl.
Quisque ut magna sit amet justo adipiscing pellentesque non eu tellus.
Integer malesuada mi ut nisl pharetra, porttitor aliquam purus elementum.
Vivamus varius ac massa egestas tempus. Proin mollis lectus quis quam dictum,
vel posuere justo semper. Vestibulum blandit mollis suscipit. Proin iaculis mi velit, sed tincidunt ligula feugiat sit amet. Integer semper viverra mauris at pellentesque. Mauris in dolor dolor. Proin ultrices nisi ante, vel scelerisque orci dignissim ut. Suspendisse facilisis ornare pulvinar. Nam accumsan lacus eget porta pharetra.
Praesent quis tortor nec tortor hendrerit interdum. Duis viverra placerat massa eget tincidunt. Phasellus mattis et justo in pulvinar. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin id neque eu diam sagittis vehicula. Maecenas ultrices elit eget cursus congue. Ut ut varius massa. Donec nisi massa, tempor vitae ligula et, iaculis adipiscing odio. Ut tempor massa felis, semper lobortis tellus dictum ullamcorper. Morbi ullamcorper feugiat sapien et faucibus. Cras aliquet eros arcu, ac sodales libero luctus a. Aliquam erat volutpat.
Donec egestas augue libero, at porta sem euismod sagittis. Integer sed nibh in enim elementum feugiat bibendum sit amet nisl. Nunc eu elit congue, placerat sapien vel, vehicula sapien. Nam in pharetra lorem. Mauris sagittis auctor magna, quis pharetra libero feugiat in. Morbi in ante tellus. Praesent eros enim, facilisis ut tristique porttitor, condimentum ac ipsum. In dictum euismod libero. Mauris scelerisque tellus at urna congue commodo. Nulla porttitor condimentum quam sit amet molestie. Aenean consequat arcu quis sapien molestie, ac vulputate nisi facilisis. Aliquam in blandit justo, quis ullamcorper quam. Maecenas a justo ut est laoreet porta sit amet nec arcu. Mauris condimentum est fermentum eros fermentum pretium. Donec bibendum gravida magna, at convallis sem vehicula a. user2 logged out on 06/12/2014 at 14:16:24.
user1 logged in on 06/12/2014 at 14:16:32.
</pre>
</div>
</div>
</div>
</div>
</div>
<script>
$("#loader").html('<object data="/map?editable=false" />');
</script>
</body>
</html>
Пожалуйста, помогите мне. Большое спасибо!