Home/ Questions/Q 8192219
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-07T04:07:41+00:00

I have this file: geoView.html.erb <meta name=viewport content=initial-scale=1.0, user-scalable=no /> <%= stylesheet_link_tag ‘application’ %>

  • 0

I have this file:
geoView.html.erb

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<%= stylesheet_link_tag 'application' %>
<%= javascript_include_tag  'application'%>
<body onload="initialize()">

 <div id="top_vendors"></div>
<div id="left_control_panel">
 <input type="button" onclick="getlistings();" value="Add Markers">
 <input type="button" onclick="clearMarkers();" value="Remove Markers">
</div>

<div id="mid_wrapper">
  <div id="map_canvas"></div>
  <div id="right_control_panel">
   <input type="button" onclick="getlistings();" value="Add Markers">
   <input type="button" onclick="clearMarkers();" value="Remove Markers">
  </div>
  </div>
</div>

</body>
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?key=XXsensor=false"></script>

My question is Id like to add a horizontal scrollbar widget from the jQuery Cupertino themed library to the div “top_vendors” here.

I looked at this tutorial as a guideline however, I haevn’t been successful

So far I have these steps in place:
1) Copied the jQuery minified library into my Assets/javascripts folder
2) Copied the jqueryUI library there too
3) Copied the Cupertino themed images into Stylesheets/images
4) Copied the jquery-ui-..custom.css file to the stylsheets folder
5) here is the head tag of my application.js file

<!DOCTYPE html>
<html>
<head>
<title>App0521</title>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"  type="text/javascript"></script>
<![endif]-->
<%= stylesheet_link_tag   'jquery-ui-1.8.21.custom.css', "application", :media =>  "all" %>
<%= javascript_include_tag 'jquery-1.4.2.min.js ', 'jquery-ui-1.8.2.custom.min.js',"application" %>
<%= csrf_meta_tags %>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

Im still not seeing any scroll bar in my browser.

What am I missing?
Thanks

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You don’t need to include all CSSs and JSs in your application.html.erb. You can configure Rails to include it for you..

    application.html.erb:

    <%= stylesheet_link_tag    "application", :media => :all %>
<%= javascript_include_tag "application" %>

    Save the js files in the assets/javascript folder and include them in the application.js

    application.js

    //= require jquery
//= require jquery_ujs
//= require jquery-ui      #here you are including the jQUERY-UI
//= require_tree .

    Also in your application.js you need to create the functions in a unobtrusive way (I think it is missing for you).

    If you want to call the slide in your ID #top_vendors for example:

    $(function() {
    $( "#top_vendors" ).slider();
});

    The same can be done for any other jQuery-UI pluging.

    I hope it helps…

    • 0