background image in a div that resizes to the size of the mobile browser in jquery

I want to place a background image in my area of content using Jquery mobile, but I want image re - happen to the size of the browser and different devices. How could I go about this?

jQuery Mobile essentially is a one page site.  Background gradients are determined by the jQuery Mobile theme do you use (a, b, c, etc...). I don't know if it is possible to use a scale with jQMobile.  I have never tried.  But you can find the code in your Theme.css file.  Look for the ui-body-a, b-body-ui, ui-body-c, depending on the theme you are using.

Nancy O.

Tags: Dreamweaver

Similar Questions

  • Image rollover nav div swap develops in the mobile platform.

    CS6, MacPro DW

    Sidebar, "navMenu" ID, "COMMANDER PARTS" and "After Hours" Nav button seem to add padding in a mobile environment. The "After Hours" button to add more than the other.

    The background image is exactly the same size. (Photoshop, layers, a single file)

    I did not use "H" tags, line height, so not a problem.

    Only difference is an all caps, other is mixed case.

    Look at the test site:

    http://02ca0d2.netsolhost.com/action_appliance_02/pages/order_parts.html

    Thanks in advance,

    Joe Satterwhite

    SatGraphics

    Your html width and height are part of the substitution of your css.

    Try to remove the width = "175" height = "42" of the image nav_order.jpg in the html code.

    Which should allow the css to regain control.

  • Make a background image of a DIV elastic?

    I try to get the background image of one div to resize when the browser text display rises or falls.

    There's a big announcement at http://jontangerine.com/silo/css/elastic-layout/ which gives many details on the layouts of elastic and addresses resizing of the images on the page to see his example in http://jontangerine.com/silo/css/pixels-to-ems/

    However, it has not worked for me when I tried to apply it to the background image.  Anyone know the code for this?

    Thank you.

    egigharbor wrote:

    Zoom the page without problem - it is the text based on the browser does not accept my image to enlarge proportionally sizing.  I know that there is a way because I tried on http://jontangerine.com/silo/css/pixels-to-ems/ and its images increase with the text.

    For some reason I struggled to make it work in my banner.

    OK... you're asking for trouble and opening a Pandora's box... but what you can do is insert the image and remove the width and height attributes. To resize the image as page zoom in and out... willingness to work in some browsers, not all (eg. works in FF, but not IE6). Be aware though that, as the image magifies, rasterization will be put in... zoom isn't so bad... like compresses just of the image.

  • What is the way to place a background Image in a Div?

    I searched Google and Adobe forums for a while now, and although there are very valid solutions for similar problems I discovered that none of them fixed the problem that I am facing. I blame myself and get lost in this encoding sloppy mine, so part of my plan was to start my stylesheet from scratch.

    My question, what is the right way to add a background image in a div? I currently have the div albums following the css style "header", here's what I typed in this section:

    < style type = "text/css" >

    @import url("..) ("/ twoColLiqLtHdr.css");

    . Header {}

    Width: 1000px;

    height: 300px;

    background-image: url(Assets/HeaderTemplate.png);

    background-repeat: no-repeat;

    background-position: center;

    }

    The problem here is that the background image is not still appear. I would appreciate help, could someone inform me on how to do this so that I can implement images in div in the future without turning my coding in a bottom right mess?

    Thank you in advance.

    Try changing it to:

    background-image: url('Assets/HeaderTemplate.png');

    Also make sure you have the case appropriate for file names: for example

    Assets = active

    HeaderTemplate = headertemplate

    etc etc.

    Sometimes these things create problems.

    Good luck.

  • Is it possible to pin a background image for (android) Tablet, that it doesn't matter what I do

    Is it possible to pin a background image for (android) Tablet, that it doesn't matter what I do

    Hello

    I believe you are trying to locate the image in the layout of tablet or phone.

    Due to lack of support on some browsers and Smartphones, pinning is disabled in Muse for Tablet and smartphone layouts.

    You can see this feature in future versions of Adobe Muse.

    You can use the scroll effect to achieve this as a solution.

    Select your items you want "pinned" and open your scrolling check Motion Control Panel the check box for the movement and the value of all the values to zero.

    Here is the screenshot for help.

    Concerning

    Vivek

  • Problem with the clone stamp and Healing brush, as soon as I use them I get a second image duplicated on top that move with the tool

    Problem with the clone stamp and Healing brush, as soon as I use them I get a second image duplicated on top that move with the tool

    You're apparently talking about Photoshop, so I'll pass this on Photoshop beginners forum.

  • Background image in a div?

    I know how to use css to place an image of background inside a div. However, I want to be contextual and differrent depending on what the current page is that image. As a hypothetical example, I would like a background image of an Apple inside, no repetitive < div class = 'content' > when the apples.html of the page is open, but then a picture of a banana would be the background image inside < div class = 'content' > for bananas.html.

    If there is a way to place background images on the fly, directly in the html code, it would be the best solution for this novice.

    Thanks for any help!

    r

    Do it this way-

    (This put in the head of each page (or put rules in a whole site)
    external style sheet)

    Now, on the Apple page, change it.

    on this subject.

    and on the page of bananas, change it to-

    Get it?
    --
    Murray - ICQ 71997575
    Adobe Community Expert
    (If you * MUST * write me, don't don't LAUGH when you do!)
    ==================
    http://www.projectseven.com/go - DW FAQs, tutorials & resources
    http://www.dwfaq.com - DW FAQs, tutorials & resources
    ==================

    "MEPE" wrote in message
    News:ffqvhs$5q6$1@forums. Macromedia.com...
    > Thank you!
    >
    > I will he give a try. I'm Googling for tutorials on this subject, but if anyone
    > has one in their pocket that will allow them to share, very much appreciated.
    >
    > r

  • How to avoid the transparent background, white in smart object (psb) conversion when the image track high fidelity that we have the ability to ignore track of white up to 16 colors.

    I have an image psd file in photoshop cc 2014 the layer background transparent. I wanted to convert to vector. The best option I've seen was converted first to a smart object in photoshop by layer-> Smart objects-> convert to smart object. then he exported a CPS. Then I opened the file in illustrator and applied image tracking tool, but the background transparent got converted to white but I had the option to skip white up to 16 trace of color. But in the case of Conversion of high fidelity, the option do not know white is not available, what do I do now?

    After using the Trace of the Image and expand the result, just find a part that is filled with white and use Select > same > fill and just delete.

  • Background image of a slide that appear in all the slides after and I can't remove it

    Hello

    I am changing a course created with Captivate 5, Captivate 7 and for some reason any background image slide 35 appeared in all the slides after one and I can not remove. The most interesting thing is that when you look at the film slides, they are different (like the original) than on the workspace that contains the background image, I'm trying to delete (screenshot below).

    Capture captivate.PNG

    Ideas or comments?

    Thank you.

    You can check the accordion of Timing (not visible on the screenshot)? There may be value to display for the rest of the project?

    Or is the image on the master slide used for other slides?

  • Background image doesn't show is not in the model

    I created a .dwt that has a background image. When I create a new file from the model that the background image is displayed in the preview in the dialog box new file, but when I open the background image is not there, and if I try to set a background image, it indicates that the background image is not editable. Clues as to what is happening? DW 5.5

    And that's your problem.  It all starts at the Template.dwt level.

    Paths to property should never point to the FILES on your local hard drive that no one can see it but you.

    background-image: url (file:///MacBook Pro/Users/markbau/Desktop /markbau.net/paper_texture.jpg);

    Most likely, the path to the Template.dwt file should be higher than the model default folder a folder.

    URL (.. / paper_texture.jpg);

    Nancy O.

  • How can I insert images of full-width that reach until the edges of the browser window?

    I would like to insert pictures full-width that reach until the edges of the browser window. When I try to do and break the boundaries of the image to the absolute limits of the page in edit mode, you can push the image back to the borders of the body in preview mode.


    I can do rectangle normal blocks full-width, but no pictures.

    Who can help me?

    1. Create a box, and then click the '100% width' along the menu bar icon to define your area to scale to the width of the browser.
    2. Import an image in the box using the parameters shown in the second picture,

  • How to create a navigation that resizes with the browser window

    Hello

    I came across this site http://www.smetana.net/. Inside the navigation components resizing with the change of size browser window, but the content remains the same size. I would like to build something similar for my site but I don't know how it's done. I'm willing to work, but I need a direction

    Thank you

    Ravital

    The following links are for the tutorials dealing with various aspects of the Flash design Adaptable fullscreen

    http://www.tutorio.com/Tutorial/liquid-Flash-layout

    http://www.gotoandlearn.com/play?ID=31

    http://www.developphp.com/Flash_tutorials/show_tutorial.php?TID=128

  • Turn off the feature that automatically optimizes the web browser, so that I can see perpetually my open tabs.

    Two weeks ago, as Firefox was normal and kick ass as usual. Then I realized that Firefox has changed-when you do things in a tab for a particular Web site you're browsing, Firefox now this thing annoying hella where it hides see your other tabs to work and "optimize" your notice on the Web site. There used as an orange button that says Firefox at the top left that had a drop down menu of commonly used functions, like the Download Manager and bookmarks. It was all super convenient. It was bright, noticeable and all the tabs that I worked with were visible at the same time. Now, what happens is, if you go to the top of a tab for a Web site that you look at, it 'unmaximizes' window and reveals once-hidden tabs, which is WICKED STUPID because it does that change the orientation of the web page so that the link that you were once to reach is now outside the trajectory of your mouse What causes epilepsy inducing madness of the glitter of the page; not to mention that it kills the time to redirect your mouse because of a characteristic that is not even help what it is. Personally, I use a computer to work, not to be entertained, as the majority of porn watching freaks of nature on this thing. It should just be something that you can turn off easily. Sorry to be so angry, but I thought that maybe I could get used to it, and it's frankly just one of the more nauseating functions on any piece of software I've ever met. Thank you!

    Looks like you have the mode full-screen (which was always in Firefox). Press F11 on your keyboard. How to make Firefox and Web sites go full screen

  • It seems that I have the mobile version on my desktop... How to bring back the desktop version?

    Friday night, from my laptop, I clicked on a site that I wanted to and he says "for mobile", but the site came to the regular format. Today, all the sites like aol and facebook Firefox seem to be adapted to the phone application. How it reconfigured to laptop?

    Try to clear your cache and your cookies.

    Note: This will be you temporarily disconnect all sites, you're connected to.
    To clear the cache and cookies to do the following:

    1. Go to Firefox > history > clear recent history or (if no Firefox button is displayed) go to tools > clear recent history.
    2. Under "Time range to clear", select "all".
    3. Now, click the arrow next to details to toggle the active details list.
    4. In the list of details, see the Cache and Cookies and uncheck everything.
    5. Now click the clear now button.

    This solve your problems? Please report to us!

  • Difficulty in div background image

    Hello

    I did a lot of research on this subject and answers os tons were developed, yet, none has solved my problem so far.

    I'm doing the background image in a div that will be fixed when I scroll vertically.

    Have a model manufactured, in which the only editable div is the rightdiv. (in red, to be easier)

    Here is my code

    CSS

    {body
    margin-top: 0px;
    margin-bottom: 0px;
    background-position: Center;
    background-image: url (.. / Images/bgdr.jpg);
    background-repeat: no-repeat;
    }


    {#wrapper}
    height: 875px.
    Width: 1000px;
    margin-right: auto;
    left margin: auto;
    background-repeat: no-repeat;

    #header {}

    background-repeat: no-repeat;

    Clear: none;

    float: none;

    height: 214px;

    Width: 1000px;

    background-image: none;

    position: relative;

    padding-top: 10px;

    {#leftDiv}
    Clear: none;
    float: left;
    height: 500px;
    Width: 245px;
    position: relative;
    text-decoration: none;
    }

    {#rightDiv}
    Clear: none;
    float: right;
    height: 484px;
    Width: 755px;
    position: relative;
    overflow: auto;
    }

    #footer {}
    height: 100px;
    Width: 1000px;
    Clear: both;
    position: relative;
    padding-bottom: 20px;
    }

    And here is my HTML code

    <!-InstanceBeginEditable name = "RightDiv"->

    < div id = "rightDiv" style = "background-image: url(Images/informacao.png)" >

    < / div >

    <! - InstanceEndEditable - >

    Well, it's that on Internet Explorer 9, the background image repeats vertically when I scroll vertically. On Chrome it will stay fixed on parchment (and that's what I want).

    I tried to add style = "" background-attachment: fixed ", but that branding will match difficulty itself relatively to the entire page, not the div only." In addition, she repeats 4 times for oocupy the screen. I can solve that by "no-repeat", but it is always attached to the browser page, not of the div.

    I tried to solve this problem for days... Help would be very appreciated.

    Funny is that this only happens in IE9... Chrome works perfectly.

    After a little research, I found it's actually "mode of operation" in Internet Explorer, all versions. A fixed background image goes out the window of the browser for positioning.

    The work around is to place a div container around the div scrolling. Place the background image in this div without css positioning container or an attachment and turn off a background image or color in div scrolling.

    Something like that...

    your content here

Maybe you are looking for