473,326 Members | 2,438 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,326 software developers and data experts.

Masking large image into background

Hi everyone,

Here's my problem. I'd like to revamp my web site, and I have this
idea.

I want to create essentially a border around the screen of about 100
pixels of just black.

Heres where it gets tricky: In the middle area which is not touched by
the border should be an image that I have created that is excessively
large, like 2000x1200 pixels or so. On a smaller screen, only some of
the 2000x1200 image should be shown - so the image should always be
sized at 100% - the black border is essentially a window into the
image. As the border (browser window) becomes bigger, more of the
image should become visible.

Right in the middle of everything should be a frame of some sort. It
can just be an iframe for all I care, but i want to place the main
content in this.

I'm currently using CSS to drive most of my site, so if it's possible,
I'd like to stick with CSS, but its not a big deal if I can only do
this with straight HTML or java or something.

Thanks for all of your help!
-Alok

Feb 26 '07 #1
1 3885
alokw wrote:
Hi everyone,

Here's my problem. I'd like to revamp my web site, and I have this
idea.

I want to create essentially a border around the screen of about 100
pixels of just black.

Heres where it gets tricky: In the middle area which is not touched by
the border should be an image that I have created that is excessively
large, like 2000x1200 pixels or so. On a smaller screen, only some of
the 2000x1200 image should be shown - so the image should always be
sized at 100% - the black border is essentially a window into the
image. As the border (browser window) becomes bigger, more of the
image should become visible.

Right in the middle of everything should be a frame of some sort. It
can just be an iframe for all I care, but i want to place the main
content in this.

I'm currently using CSS to drive most of my site, so if it's possible,
I'd like to stick with CSS, but its not a big deal if I can only do
this with straight HTML or java or something.

Thanks for all of your help!
-Alok
I have two design concerns about your plans, which you might resolve
without discarding your overall concept.

First of all, will there be any content superimposed over the background
image? If so, have others look at the result to ensure that the image
does not interfere with reading the content. I once saw a page where
the text used yellow print with a black background that was filled with
orange daisies. It was impossible to read the text. Yellow text over a
black background without the daisies would have been quite readable.

Second, be careful of your use of frames. In general, use frames where
each component frame provides content, some of which needs to remain in
the browser window when content in the other frames changes. Don't use
frames merely to show how clever you are.

A good example of the use of frames is at <http://cad.chp.ca.gov/with
Los Angeles selected as the area in the top frame. If you select an
entry in the middle frame, you get details in the lower frame. Note
that the frame borders can be dragged to resize the frames and that,
when the middle frame refreshes (about once per minute), neither of the
other two frames are disturbed.

A bad example of the use of frames is at the Medicare site. Details
about an individual claim are in a frame so narrow vertically that the
entire information cannot be comprehended without constant vertical
scrolling. When I need to see my own Medicare claims, I force the frame
into a window of its own. The frames above and below the claim contain
little or no useful information. Thus, frames are not really needed in
this case; worse, they negatively impact the use of the pages.

--
David E. Ross
<http://www.rossde.com/>

Natural foods can be harmful: Look at all the
people who die of natural causes.
Feb 26 '07 #2

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: Dana Epp | last post by:
I have a ToolBarButton that when I set it to disabled (button.Enabled = false;) causes a really ugly gray masking effect to take place. This is normal and the intended way of the button, but I...
2
by: ke6rwj | last post by:
I am developing a kiosk application, this will not have a keyboard or mouse for use. The system rotates through a series of images - no problem One image is very large, like this one... ...
1
by: arad | last post by:
I need help with masking an image in Flash (8). I have an outline of a seashell image (black and white). It's a jpg image that I inserted into Flash. What I want is for the image to appear one line...
6
by: Rob | last post by:
Hello, I'm sure this has come up before. I have need for a collection of all elements/objects in an HTML document that have any kind of an attribute (HTML or CSS) that is making use of a URL to...
1
by: superDk | last post by:
Hello, IE6 is adding a large margin between my two containers (container1 & container2) everything works fine in IE7 and Firefox. I've been searching on-line for a fix but I've had no luck. It...
13
by: sevenz24 | last post by:
So i have my images set up like this : http://cgi.ebay.com/Tippmann-98-paintBall-Marker-Gun-Paint-Ball_W0QQitemZ250274334261QQihZ015QQcategoryZ47248QQssPageNameZWDVWQQrdZ1QQcmdZViewItem Scroll...
2
by: thephatp | last post by:
I'm having a problem with IE rendering correctly. I'm experimenting with using all div's in my pages now, and I'm not very familiar with the quirks of IE. I have created a sample page, and I'm...
2
by: studentofknowledge | last post by:
For some unknown reason ie is placing images I have in a div in a weird way. One image is overlapping another but this problem is not occuring in mozilla. I have looked at my code over and over again...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.