Jquery-mobile: page layout with fixed left hand menu - jquery-mobile

I would like to make a jquery-mobile app having a left hand menu.
Is there a way to have it fixed like the fixed NavBar can be set? I think I need a vertical NavBar on the left side.
Thank you, F.

If you put the css "position:fixed" into the containing div of the list view, this produces a fixed effect.

Related:
JQuery mobile pageslide, new facebook menu
Examples:
http://jsfiddle.net/LwrqY/5/
http://jsfiddle.net/LwrqY/5/embedded/result/ (view on mobile)
Now these are just examples and will need to be tweaked to work, just a concept

Related

Need Vaadin navigation control with two arrows on left and right like on passed link

I am extremely new to Vaadin, and I don't know all controls, I tried to google but didn't find type of control. My question is which is control visible on this link
http://demo.vaadin.com/sampler/#foundation/cssinject
which is used for navigation (left and right arrow buttons on left and right side of screen which you press to change content in middle or something like this doesn't exist in vaadin by default and this is in jquery ?) ?
I need to implement this, to change content on click, to allow user to iterate through shopping cart like this.
They are probably just buttons. Imagine 3 columns Button | Content | Button
Button.onclick -> Load Content
I use this carousel add-on which does that. Buttons are bigger but can be changed using css.
It has a nice transition effect, sliding left and right.

Firefox Addon Development: Setting the 'panel' to the bottom of the page

I want to create a panel/frame that looks like the "History" panel that appears on the left of firefox when you punch in "Ctrl+H". I want my panel to be at the bottom.
I feel I must use panel but there's no function that tells me how to set it to the bottom of the currently opened webpage.
How to do it?
The show() method on a Panel object allows you to set an anchor for positioning the panel, `show(anchor). It requires an object in the browser DOM which you can get fairly easily.
You can use that to anchor the panel on any element in the browser. It might be tricky to find the element you want to use for exact positioning, I just opted for the status bar since you wanted the panel at the bottom.
Here's the SDK code that will position a panel at the bottom (left) of the page:
var wuntils = require('sdk/window/utils');
var panel = require("sdk/panel").Panel({
contentURL: 'http://stackoverflow.com/questions/15390974/firefox-addon-development-setting-the-panel-to-the-bottom-of-the-page'
});
panel.show(wuntils.getMostRecentBrowserWindow().document.getElementById("statusbar-display"));
This feature is not currently supported yet, but it will be soon. Here the proposal: https://github.com/mozilla/addon-sdk/wiki/JEP-Panel-positioning where you can follow the discussion and the bugs. I already have a prototype that hope will land soon.

Creating a Firefox add-on with a sidebar on the right hand side

I'm trying to edit Daniel Buchner's sidebar library so that the sidebar shows up on the right hand side. Do I do something along the lines of the following?
sidebar.browser.style.MozBoxDirection = 'reverse';
Your approach doesn't work because you would need to change the direction of the sidebar's parent box, not its children. However, that would cause unnecessary fallout (like the default sidebar appearing on the right side and developer tools on the left). So it is better to solve the problem by changing this line:
document.getElementById('browser').insertBefore(clone, splitter);
Instead of inserting your sidebar on the left side you can use appendChild to add it to the end of the container. You will also have to add your own splitter however - you can clone the sidebar splitter and change its ID.

how to make only a part of screen scrollable

I've developed menu tabs in Tabs. jsp and included it in my Main.jsp . Now is it possible to make the Tabs not scroll in the jsp (i,e) the file that is included should not be scrolling down. How do i do this?
This has got nothing to do with Struts2, what you need is a floating menu which shouldnt scroll and should be fixed, there are multiple ways of doing it, one very simple but nice way can be found here

Resizable columns / panels for content in jquery?

does any one know if there is an example available for sliding panels in jquery? If so, can someone send me a link? This is what I want to accomplish.
On my main screen I want to have three divisions. One right column that covers half the screen and then the left column divided in two rows. I want to expand and/or shrink the right column and/or left column and/or the top row in the left column and/or the bottom row in the left column.
Think og it as an IDE with the left side of the coding area and right side as project explorer and the properties. The coder would like to see any three of the sections at once or would like to expand each working area.
I am looking for a jquery solution for such!
Thanks
Sounds like the way jsfiddle.net works
This is available as a plugin. http://docs.jquery.com/UI/Resizable
You could also use the jQuery splitter plugin: http://www.methvin.com/splitter/
Also see (2011): http://jcubic.wordpress.com/2011/03/06/jquery-splitter-split-container/
Flexigrid is a new (2012) option: http://flexigrid.info/
The most robust solution for this is to use the jQuery layout plugin. You can find it here: http://layout.jquery-dev.net/

Resources