您好,我会实现一个基本的滑块。我想使用http://flexslider.woothemes.com/index.html来做到这一点
在我的文件 application.htlm 我添加了代码如何说入门链接 http://www.woothemes.com/flexslider/
但在没有基本滑块的情况下显示图像正常。我注意到在文件应用程序中看到我无法解析文件 jquery.flexslider.js 为什么?
这是我的application.html
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAlDKLvBpApFUJJVjSXbZ- BV40B3xBVtYY&sensor=true&language=it" type="text/javascript">
</script>
<meta charset="utf-8">
<title>SmartEconomy Project</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile- 1.3.0.min.css" />
<%= javascript_include_tag :defaults %>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"> </script>
<%= csrf_meta_tag %>
<!-- Place somewhere in the <head> of your document -->
<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script>
<script src="jquery.flexslider.js"></script>
<!-- Place in the <head>, after the three links -->
<script type="text/javascript" charset="utf-8">
// Can also be used with $(document).ready()
$(window).load(function() {
$('.flexslider').flexslider({
});
});
</script>
<script>
$(document).on("click", ".show-page-loading-msg", function() {
var $this = $( this ),
theme = $this.jqmData("theme") || $.mobile.loader.prototype.options.theme,
msgText = $this.jqmData("msgtext") || $.mobile.loader.prototype.options.text,
textVisible = $this.jqmData("textvisible") || $.mobile.loader.prototype.options.textVisible,
textonly = !!$this.jqmData("textonly");
html = $this.jqmData("html") || "";
$.mobile.loading( 'show', {
text: msgText,
textVisible: textVisible,
theme: theme,
textonly: textonly,
html: html
});
})
.on("click", ".hide-page-loading-msg", function() {
$.mobile.loading( 'hide' );
});
</script>
<script type=text/javascript>
function getLatLon(){
var address=document.getElementById("Address").value;
// var address=document.getElementsByName("address").value;
var cat=address.concat(',');
var user1Location = cat
var geocoder = new google.maps.Geocoder();
geocoder.geocode({
address: user1Location
}, function(locResult) {
console.log(locResult);
var lat1 = locResult[0].geometry.location.lat();
var lng1 = locResult[0].geometry.location.lng();
$("#demo").html("latitude:" + lat1 + "<p>longitude:" + lng1 + "</p>"
+"<input type='hidden' id='latitude' name='promotion[lang]' value='"+lat1+"'>"+
"<input type='hidden' id='longitude' name='promotion[long]' value='"+lng1+"'>");
});
// var vett = [
// ['blabla',37.44,54.33,1],
// ['casds',4334.44,323.2,2]
// ];
}
</script>
</head>
<body>
<div data-role="header" id="ale" data-theme="a">
<h1> SmART_eConomY </h1>
<!-- Place somewhere in the <body> of your page -->
<div class="flexslider">
<ul class="slides">
<li>
<%= image_tag "facebook.png" %>
</li>
<li>
<img src="slide2.jpg" />
</li>
<li>
<img src="slide3.jpg" />
</li>
</ul>
</div>
<div data-role="controlgroup" data-type="horizontal"class ="ui-btn-left" >
<%= link_to 'Sign up', new_user_registration_url ,'datatheme'=>'c','data- role'=>'button','data-icon' => 'plus','data-iconpos'=>'left', 'data-transition'=>'fade'%>
<%= link_to 'Sign in', new_user_session_url,'data-role'=>'button','data-icon' => 'plus', 'data-iconpos'=>'left', 'data-transition'=>'slidedown' %>
</div>
<div data-role="controlgroup" data-type="horizontal"class ="ui-btn-right" >
<a href="users/auth/facebook" data-ajax="false" class="auth_provider">
<%= image_tag "facebook.png", :alt => "Facebook" %></a>
</div>
</div>
<div data-role="navbar" data-theme="b" data-iconpos="bottom" >
<ul>
<li><%= link_to "Home",promotions_path,'data-icon'=>'home','data-theme'=>'c','data- mini'=>'true',"data-ajax"=>"false"%></li>
<li><%= link_to "Add Good",new_good_url,'data-icon'=>'plus','data-theme'=>'c','data- mini'=>'true',"data-ajax"=>"false"%></li>
<li><%= link_to "Create Promo", new_promotion_url,'data-icon'=>'plus','data-t theme'=>'c','data-mini'=>'true',"data-ajax"=>"false"%></li>
<li><%= link_to "Add Category",new_category_url,'data-icon'=>'plus','data-theme'=>'c','data-mini'=>'true',"data-ajax"=>"false"%></li>
<li><%= link_to "Search Promo",:promo_search,'data-icon'=>'search','data-theme'=>'a','data-mini'=>'true',"data-ajax"=>"false" ,'target'=>'_parent','class'=>'show- page-loading-msg', 'data-theme'=>'c','data-textonly'=>'false', 'data-textvisible'=>'true', 'data-msgtext'=>'Map is loading, sorry for latency' ,'data-icon'=>'search','data-iconpos'=>'right'%></li>
</ul>
</div><!-- /navbar -->
<% if user_signed_in? %>
<div class="ui-bar ui-bar-b" data-role="header">
<%= link_to "Profile",:accountsettings,'data-icon'=>'gear','data- role'=>'button','data-mini'=>'true'%>
<h1> Signed in as <%= current_user.email %>. Not you?</h1> <%= link_to "Sign out", :signout,'data-icon'=>'delete','data-role'=>'button','data-mini'=>'true'%>
<h2 class="notice" <%= notice %> class="alert"><%= alert %> </h2>
</div>
<% end %>
<div class="ui-bar ui-bar-b" data-role="header">
<p class="notice"><%= notice %></p>
<p class="alert"><%= alert %><p/>
</div>
<%=yield %>
</body>
</html>