Re: [css-d] CSS image question

2008-09-08 Thread Chris Akins
This is what I'm doing for my rounded corners on this page:

http://www.springfieldmo.gov/newsite/3col.html

One image of a full circle is needed for the four different quadrants
shown in the 4 corners.  One http request this way.
My main navigation tabs are similar in that they are CSS sprites. One
larger image holds all three states of the tabs: off, rollover, and
highlighted.  One image means fewer http requests and only one
instance of the image overhead for file structure.  Overall image size
for one large gif image like this is smaller than the 15 individual
images I would need for small sliced images.

Chris A.

On Mon, Sep 8, 2008 at 10:54 AM, Lou Hernsen <[EMAIL PROTECTED]> wrote:
> Thank you SOOO much!
> NOw I can put hurricanes & weather in my pirate game!
> Lou
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] CSS image question

2008-09-08 Thread Lou Hernsen
Thank you SOOO much!
NOw I can put hurricanes & weather in my pirate game!
Lou


- Original Message - 
From: "Alan K Baker" <[EMAIL PROTECTED]>
To: 
Sent: Sunday, September 07, 2008 11:00 PM
Subject: Re: [css-d] CSS image question


> Yes Lou, CSS can do this.
>
> Simply make a box:
>
> .boxname {
> position:relative;
> background-image:url(your 200px x 200px image filename and path);
> background-position:-100px -100px;
> width:50px;
> height:50px;
> overflow:hidden;
> /* position, padding, margins etc to suit. */
> }
>
> to move to a different part of your big image, just change the background
position x & y.
>
> If you want to move your box to an absolute position then change
position:relative to position:absolute and add top:y; and left:x; where x
and y are your coordinates.
>
> Regards,
>
> Alan.
>
> www.theatreorgans.co.uk
> www.virtualtheatreorgans.com
> Admin: ConnArtistes, UKShopsmiths, 2nd Touch & A-P groups
> Shopsmith 520 + bits
> Flatulus Antiquitus
>
>
>   - Original Message - 
>   From: Lou Hernsen
>   To: css-d@lists.css-discuss.org
>   Sent: Monday, September 08, 2008 3:26 AM
>   Subject: [css-d] CSS image question
>
>
>   Hi.. I'm sorta new to css.. here is the question.
>
>   Lets say I only want to show a 50x50 px part of an image that is 200x200
on
>   a web page.
>   I want to show the area starting at 100x100y to 150x150y in a box
50x50...
>   can css do this?
>   or should I be looking at javascript?
>   What is the syntax for the command? and is the command used in the
position
>   command?
>
>   thanks for your time and answer
>   Lou
>
> __
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
>
>
> -- 
> No virus found in this incoming message.
> Checked by AVG.
> Version: 7.5.524 / Virus Database: 270.6.19/1659 - Release Date: 9/8/08
7:01 AM
>
>

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] CSS image question

2008-09-07 Thread Alan K Baker
Yes Lou, CSS can do this.

Simply make a box:

.boxname {
position:relative;
background-image:url(your 200px x 200px image filename and path);
background-position:-100px -100px;
width:50px;
height:50px;
overflow:hidden;
/* position, padding, margins etc to suit. */
}

to move to a different part of your big image, just change the background 
position x & y.

If you want to move your box to an absolute position then change 
position:relative to position:absolute and add top:y; and left:x; where x and y 
are your coordinates.

Regards, 
 
Alan.
 
www.theatreorgans.co.uk
www.virtualtheatreorgans.com
Admin: ConnArtistes, UKShopsmiths, 2nd Touch & A-P groups
Shopsmith 520 + bits
Flatulus Antiquitus


  - Original Message - 
  From: Lou Hernsen 
  To: css-d@lists.css-discuss.org 
  Sent: Monday, September 08, 2008 3:26 AM
  Subject: [css-d] CSS image question


  Hi.. I'm sorta new to css.. here is the question.

  Lets say I only want to show a 50x50 px part of an image that is 200x200 on
  a web page.
  I want to show the area starting at 100x100y to 150x150y in a box 50x50...
  can css do this?
  or should I be looking at javascript?
  What is the syntax for the command? and is the command used in the position
  command?

  thanks for your time and answer
  Lou

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/