Now it??™s time to start the progressive enhancement and layer on the help sidebar behavior.
Styling with CSS
This is a book about JavaScript, not CSS, so I won??™t get into too much detail about styling the
form. For this example, use the CSS file included in the example files (public/stylesheets/
main.css). To use this CSS file in your Rails project, open the layout file (app/views/layouts/
application.rhtml) and insert this line into the of the document:
<%= stylesheet_link_tag "main" %>
You should now have a styled form page. At this point you need to think about the help
panel and how it will be styled. First you??™ll need to add the help panel into the HTML. Add a
to your layout. You can add a little bit of fake content in there temporarily for
testing if you need to. Here??™s how the layout looks now:
CHAPTER 9 n A DYNAMIC HELP SYSTEM 194
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Pro DOM Scripting with Ajax, APIs and Libraries Chapter 9<%= stylesheet_link_tag "main" %>
<%= yield %>
Some example help content.
You??™ll notice that the help panel is now on the page, but it is dangling at the end of the
form in a rather ugly way.
Pages:
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273