Fixed a image in background

cachousam

Avatar: cachousam

2013-02-02 15:19

Hi
I am trying to insert an image in my background, and I wish it adapts to the screen resolution of the client.
Here is a capture of my page.

http://img51.imageshack.us/img51/7420/fixeruneimage.png.
And here is my code in container.tpl

<div id="postit"><p></p><p></p>
<p><marquee behavior="scroll" direction="up" scrollamount="2" scrolldelay="1" onmouseover="this.stop()" onmouseout="this.start()" height="200" width="100">


<b><strong>Avec la nouvelle centrale<br/><br/><br/>KSENIA</strong><br /><br/>Enfin vous pourrez gerer<br/><br/>Votre systeme d'alarme<br/> depuis votre smartphone<br/><br/>
<b><a href="http://www.jonquieretech.eu/centrale-ksenia,14.html"><img src="$config[dir_files]/web serveur ksenia.png" /></a></b>
</marquee>
</p>
</div>


and my code in defaut.css

#postit { position: absolute; top: 100px; left: 100px; z-index: 300; width: 273px; height: 250px; background: transparent url('img/iphonedomi.png') no-repeat center ;
font-family: comic sans ms; font-size: 16px; font-weight: normal; color: #000; font-style: italic;text-align: center; line-height:10px; margin: 0;padding: 0;}

#postit p { padding:0 10px 0 10px; padding:10px 10px 0 10px;}


Thanks for your help

» Quick.Cart v3.x

interkob

Avatar: interkob

2013-02-04 08:29

The cell phone image? It's very small to get it fixed.

cachousam

Avatar: cachousam

2013-02-05 09:02

Hello,
Yes, it is the mobile phone.
But the picture is big or small, I do not understand the difference.
In fact, I want to insert an image in my background, and that , always in the same place by the border of my web page. And this with any screen resolution of the visitor. Because on a large screen, everything is fine, but on a smaller notebook as a example, the image is inside the web page.
I hope to have been more clear.
Thank you for your help

interkob

Avatar: interkob

2013-02-05 11:17

This is not very related with Quick.Cart. I recommend to search for solutions on google. For example:

http://css-tricks.com/how-to-resizeable-background-image/
http://www.youtube.com/watch?v=6YlGJVqepLA

cachousam

Avatar: cachousam

2013-02-10 15:41

Hello,
I think you did not understand my request.
In fact, my background is gray!
The phone is another image that should be placed on my gray background.
And always at the same place on the left of my web page.
Thank you for your help and excuse me for my bad english.

For information
I put an avatar in my profile, but it does not appear.
Dominique from LYON in FRANCE

interkob

Avatar: interkob

2013-02-10 21:19

In the same style.css line where is your background images declared, you should insert this one also.

background-attachment:fixed;

Now you will have the image in the same position, no matter you scroll web page down or up.

Back to top
about us | contact