How to create a scaled page background image?

Hi - does anyone know of a way of creating a page background image which will scale to fit any screen width? I've tried googling it, but get back so many complicated explanations that I don't know which to believe. Up until now I've resorted to creating a large image, usually around 1700 x 1400px, which just about works, but obviously smaller screens lose a lot of it. I'd really like to understand how to do this properly,
Thanks
SW

How far back in browser version history do you want to support?
IE9+ and any modern browser (like Firefox, Safari, Chrome and Opera) will work with the background-size:cover attribute:value in CSS3: http://www.w3schools.com/cssref/css3_pr_background-size.asp
For older browsers, you'll need a bit more complicated solution using javascript like this page: http://louisremi.github.io/jquery.backgroundSize.js/demo/

Similar Messages

How to create a full page background image that is fluid?

I'm creating a website for my portfolio, and one of the things I wanted to have is a full page background image that the div tags are in. I know there is a way to put it in via page properties, but that doesn't allow you to add CSS styles and I want the image to re-size with window changes. This requires putting the image in a div tag, but then it pushes the other div tags (such as my header section and navigation) so that they aren't over the image like I want. Is there a way to push the image div tag to the back so that the other div tags go over it.
I'm using HTML5, and it will also be a responsive design, but the fluid background is only for desktops.
I don't go on the adobe website often, so if you have an answer to this, or need more information to figure it out please email me at [email protected] and you'll get a faster reply than on this forum.
Thank you everyone for your help.

You should set this forum to email you on a reply.
I don't have a link in your question to determine how you are trying to do this, but here's a technique I have used:
Take a look at this website and see if it doesn't have what you are trying to do. You'll see the flag in the background and I have used opacity in the layers on top of it to keep the flag somewhat visible.
Now, what the flag does not do is re-size itself with the viewport (the browser window). But the flag is in a div that sits on top of the body. My code is accessible, but you're looking for the flag div and it's defined in CSS thusly:
#flag {
          width: 100%;
          background-image: url("../images/polish-flag.png");
          background-repeat: no-repeat;
          min-height: 900px;
Now, CSS3 adds a new attribute you can apply to the background image thusly:
     background-size: 100% 100%;
That would make your background fill the viewport.
I chose to not do that, because I was worried about versions of Internet Exploder before 10.

Keynote 6.0 isnt loading master page background image

I made a kaynote in Keynote 5.3 and my coworker opened it in keynote 6.0 but the master pages background image fill was not loading and came up blank. On several other laptops with keynote 5.3, the background images loaded properly.
why and how do i fix this?

One of the most common causes of Mavericks problems appears to be If the hard drive was not wiped clean before installing Mavericks as remnants of incompatible software remain.
I would back up then clean install the OS.

Page background images, songs, movies, don't publish

I'm new to this. I've researched other threads here and cannot find this specifically. I was so proud. What beautiful pages I had created in iWeb and so sad to discover dot mac couldn't display them!
My tinted page background images have never published. These files published into my hard drive folder but are not on iDisk. Songs appear with a tiny Q for Quicktime and a ? - files were dragged into iWeb from audio media browser. Larger Q with the movies. I have one large Movie 18.5, one smaller - 4.5 MB. It's cool if dot mac can't handle it, but perhaps they shouldn't promote that they can! I'm a huge Mac fan, but any tips or tricks before I attempt to cancel my dot mac purchase? I went back and changed all the background image file names. No luck. I am so hoping that I'm just doing something stupid. I signed up for dot mac to share my music and movie files. Help me make it work!
G4 Mac OS X (10.4.5) http://web.mac.com/divinelyfem

Looks OK by me, Bruce

How to create a Registration page in WebDynpro java

Hi All,
How to create a registration page in Web Dynpro java.Whatever i enter in the field of registration page should be stored in the pcd..So plz help me???
Message was edited by: suman sahu

Hi Suman,
I have a similar kind of requirement , please let me know if you have got the solution for this??
Regards,
Ravi.

Does anyone here knows how to create a login page thru JDBC?

Anyone here knows how to create a login page which connect to database thru JDBC but not JDBC-ODBC bridge?

Hi..pls you'll do people here a great good if you could explain yourself better..!
Anyway if you are trying to connect to an Oracle Database you dont need the jdbc-odbc bridge as oracle provides a special driver for java applets/applications that is "the thin driver" and the "oci driver"..so if you are connecting to Oracle your connection will look like this:
Class.forName("oracle.jdbc.driver.OracleDriver"); //not sun.jdbc.odbc.JdbcOdbcDriver
Connection con = DriverManager.getConnection ("blah blah, blah");
no need for the jdbc-odbc bridge.
I hope i've answered your question.
Thanks.

How to not print a certain background image?

Hello all,
I wonder how can one make a certain background image automatically not to be printed ...
changing the transparency to 0% every time is not very elegant ...
cheers
North

A big red button in the middle of the screen that says Whatever.
Peter

How to create a contact sheet of images in CS5

How to create a contact sheet of images in CS5. Different set up than older version I worked on before.

Have I missed something that the Adobe Bridge Output Module didn’t seem to offer a printing option? Tried the older plug-in which is what I was familiar with, but that seems to download all the plug ins, not just contact sheets. Do I have to download the whole shebang?

How to create a master page in Dreamweaver?

Hi
Does anyone know how to create a master page in Dreamweaver ??

Dreamweaver Templates ~
http://www.smartwebby.com/web_site_design/dreamweaver_template.asp#1
Server-Side Includes ~
http://www.smartwebby.com/web_site_design/server_side_includes.asp
Spry Tabbed Panels ~
http://labs.adobe.com/technologies/spry/samples/tabbedpanels/tabbed_panel_sample.htm
Spry Accordion Panels ~
http://labs.adobe.com/technologies/spry/samples/accordion/AccordionSample.html
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Page background images show in preview but not after uploading

Hi -
I've built a page with a flash animation, and some other
minimal information below the movie. I have a page background image
that should be repeating horizontally behind everything. When I
preview it, all looks great! After I upload it to the actual site
the background images disappear. The code is all within the page.
Any ideas?

never mind... problem resolved.
my error in not checking my files over. oops.

How to create a "Child" page?

Hi there,
I have been watching tutorials on Apple's site and cannot find any help on how to create a Child Page in iWeb. In other words, how to create pages "under" other pages?
Any advices?
Thanks,
PapaChill

iWeb doesn't provide the capability to do this natively, but see the +"Drop Down Menus in iWeb"+ section HERE. And you'll find more suggestions by doing THIS.

How to create a html page

Hello,i am very new to dreamweaver 8,and i have searched
everwhere possible on how to create a html page.My website has a
navegation bar.And on the navegation bar it has links,like
forums,your accounts,and etc,but thats already integrated with the
website.Now i have an option in the admin area,wher i can create a
new category so that it would show up in the navegation bar,and i
have a drop down menu where i cans select what to put in that
category.But also i have an option to put a external url,so that
when they click on it,it will take them to where that link is
directed.The point is that i asnt to make a category in the
navigation menu that says Lirics.So that i can put lirics of songs
and etc,and that when users click on that link it will take them to
the lirics page..Do you guys understand?Sorry for the bad english,i
am now quite good with it..

The most eloquent description will do nothing for us. To get
a solution to
your problem, we must see your code. Can you upload the file
and post a
link to it, please?
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"don_playboy" <[email protected]> wrote in
message
news:eaadi9$kjf$[email protected]..
> well what i am trying to say is that i created a Folder
named
> Liricas(which is
> lirics in spanish),on my ftp.Now since i created that
folder in my ftp,it
> will
> show on my navegation menu control panel.But it will be
blank since it has
> nothing on it.Now what i want to do is,sicne i created
that folder,and i
> go to
> my nav meny control panel and select it as a category it
will show on my
> navegation menu(the Liricas that is),but when u click it
it has
> nothing,since
> it has no html or anything in the category.Now i want to
create a html
> page so
> that i can put albums names,and under those albums name
i want to create a
> link
> or category thats for lirics.So all this will be stored
on the ftp.and
> when
> users click on the Liricas category on my navigation
menu,it will take
> them to
> the liricas index page,which will show all the lirics...
>
>
>
>

How to create a HTML page like iView, thanks in advance!

How to create a HTML page like iView, thanks in advance!
I'm a newcomer, would you please tell me how to create a HTML page in WebDynpro ? In fact, i want create one welcome page which use html format and include some javascript.
thanks again.

jakinapallykrishna , thank you very much for you reply.
The pdf file is a simple application, but i want know how create a view in HTML format (<HTML>... </HTML>), maybe use HTMLB control, i don't sure it.
In fact, I need create a view in portal, some pictures in it, once mouse over one picture, it need change another picture replace old one. I don't know how to do it, just know it can be handled in HTML page. So, i need help.
Thanks.

How to create a One Page checkout

Hello nice people,
Does anybody knows how to create a ONE-PAGE Check Out Process in Online Shop Layout?
Thanks in advance

"I can resolve the problem if I can insert one page (or step) after
"registration - buy". This would be a "summary" page where the customer has
the last opportunity tu check out all his data and, if it is needed, to
correct his order, billing address, shipping, the way of payment"
<<< The only way to do this is with JS. You can use jQuery's .load() method
to load your cart into the registration layout. You'll have to do some
parsing of that cart table to obtain things like product name, quantity etc
and present this in some kind of summary. Parsing tables in jQuery is not a
nice task, so if you're going to embark onto producing this kind of summary
you may want to get rid off the table from the cart and simple throw in
some divs and tags which will help you parse the cart nicely. That mans
you'll have to construct the layout for the cart though using JS.
Example of alternative cart layout:
It renders like this:
product one
(S)
product one
(M)
onchange="UpdateItemQuantity(this.value,231502,234492,6737768,183427,'','US');return
false;" class="cartInputText" type="text" value="1">
onchange="UpdateItemQuantity(this.value,231502,234492,6737768,183428,'','US');return
false;" class="cartInputText" type="text" value="3">
$10.00
$45.00
$55.00
You can see that this is much nicer to read and you can then construct your
own data structure that will hold this info and render it it whichever way
you want to. You can even write it back as a table where each product is in
its own row. You may want to look at something that gives you template.
model, controller like ember.js.
Anyway, I hope that helps somewhat.
Cheers,
M

How to create a multi-page collapsible & CSS styleable table of contents box?

How to create a multi-page collapsible & CSS styleabe table of contents box?
Is there a tool available for Dreamweaver or for standalone operation that can create for multi-page articles a collapsible & CSS styleabe table of contents box based on the page titles?

You could do this with jQuery.
Table of Contents -
http://www.downloadjavascripts.com/list/javasiteccc68/Details.aspx
Collapsible Panels, Tables & Accordions -
http://www.downloadjavascripts.com/Collapsible_And_Free_Accordion_Panels.aspx
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

How to create a scaled page background image?

Similar Messages

Maybe you are looking for