Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Masking large image into background

Reply
Thread Tools

Masking large image into background

 
 
alokw
Guest
Posts: n/a
 
      02-26-2007
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

 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      02-26-2007
In article
<(E-Mail Removed) .com>,
"alokw" <(E-Mail Removed)> wrote:

> 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.


You said it, excessively large. Everyone has to download a huge
file no matter what they can see of it. Bad idea.

> 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.
>


You know how to make a big black border on a box? You know how to
set a bg image? You know how to put a box within another box? You
know you can make boxes have backgrounds or just be transparent
so the parent bg shows through? You say you are "currently using
CSS to drive most of my site" so you must know these simple
things, so what is actually the problem? How to code for a frame?
How to stop the pic showing up in the frame? What?

> 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.


--
dorayme
 
Reply With Quote
 
 
 
 
David E. Ross
Guest
Posts: n/a
 
      02-26-2007
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.
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
DIV background-repeat background-image? For shadow effect jc ASP .Net 3 03-19-2008 04:19 PM
DIV background-repeat background-image for shadowing effect jc HTML 1 03-19-2008 02:16 PM
Masking must avoid areas outside the image academic Java 0 02-15-2006 07:00 PM
changing a background image to a background colour? Dj Frenzy Javascript 3 02-10-2004 08:08 PM
Masking I.P. Addreses you tell if some is masking their's ME And My Mustang NG Computer Support 1 06-22-2003 06:29 AM



Advertisments