Static Background with dynamic...

User 2132015 Photo


Registered User
6 posts

I am trying to design a website using Visual Site Designer but I'm really having a hard time finding how to get the results I need. I've done a forum and info search but I am unable to find what I am looking for. I have a feeling I'm going to be posting here a lot. Currently I have three questions:

1.) I was wondering if there is a way to place a background image that is stationary (that doesn't scroll or move with the rest of the site's content).

2.) when inserting a background image it seems to want to tile it. Is there a way to center the image and not tile it?

3.) is there a way to make objects transparent? I was going to place text inside large blocks for blogging -- just thought it would look cool if the blocks containing text were slightly transparent.

Thanks!
User 187934 Photo


Senior Advisor
20,190 posts

Here's part of the equation.:)

http://www.coffeecup.com/forums/designer/vsd-stationary-background/
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 187934 Photo


Senior Advisor
20,190 posts

And here's the rest. Post back if you need more help.

http://progrower.coffeecup.com/opacity.html
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2132015 Photo


Registered User
6 posts

Very cool, thanks for the help.

I noticed on the other post it mentioned posting in the head but I don't know how to access the code/HTML to edit it?

How do I view the code?
User 187934 Photo


Senior Advisor
20,190 posts

In VSD click on "Edit" in the top right corner. Now on the menu that drops down click on "Edit Header". There you can paste your code.:)

Or short cut keys

Ctrl+Alt+H
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2132015 Photo


Registered User
6 posts

Thanks again for all the info --
A follow up question, I'm attempting to use a GIF as my background image. I placed the code in the header as described above but it's not stationary (it doesn't seem to be working). This is what I've placed:


<style type="text/css">
body{
background-image:url('background.gif');
background-repeat: repeat;
background-attachment:fixed
}
</style>

background.gif is the name of my background - it is in a sub-folder on my D: drive, not in the same folder as my site.

Does my background need to be a JPG? does the background need to be in the same folder as my site?
User 187934 Photo


Senior Advisor
20,190 posts

Is the background.gif in the root directory?:)
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 122279 Photo


Senior Advisor
14,454 posts

Otto, if you reference your background image like this:
background-image:url('background.gif');

the browsers will expect that the image is in the same folder as your css and html files.

If you want to stick it into the 'files' folder that VSD creates, you'd better use the 'add files' in VSD in order to add the image file. It will then be uploaded to the right place.

Mind you. now that you already have inserted the image, obviously without adding it, you shoud use the 'remove files' to get it out of the system of VSD and then reinsert and add it the correct way.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 2132015 Photo


Registered User
6 posts

YEAH!
Thanks Eric and Inger,
I got the stationary design -- putting it in the root directory was the final fix.
I am sure I will have a dozen more questions before the week is out.
User 2132015 Photo


Registered User
6 posts

I am struggling a bit with the opacity -- the site you referenced above shows the following code:

<img style="width: 604px; height: 402px;
border: medium none; opacity: 0.5;
"alt="" src="http://mydomain.com/pictures/mypicture.jpg">


Do I place this under the "header HTML" tab or the "Onload Events" Tab?

The section of this code listed as "http://mydomain.com/pictures/mypicture.jpg", I know I would have to put the info in to match my site and I know I will need to "add files" as noted by Inger above, how do I preview the site? Can I preview the site? Do I have to list it just as it is above? I guess I am not too sure how I adjust this above code so it will work with my site.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.