By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,948 Members | 1,595 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,948 IT Pros & Developers. It's quick & easy.

repeat image for border

P: n/a
Can someone point me to some resources on how to tile an image to create a
border?

<td>
<img src="images/MTile.png" width="1" height="30" alt=""></td>

I have something like that where I need to repeat x times where x depends on
the width of the browser. (Not sure if its a good idea to use a bitmap of
width 1 but I could use one that is larger and then use both(e.g., maybe one
that is 10 pixels wide and repeat that as needed and let the 1 pixel wide
one get the rest(I have some "ends" on the border that I need to display too
so it sorta needs to be exact))

Not sure how to do this with js(just learning it) but obviously I just need
to get the width of the border and then figure out how many times I need to
repeat the code.

I have several issues I am wondering about though. First off is that I have
used photoshop imageready to create a roll over menu bar but in firefox when
I use the down state it leaves a selection rectangle around the image but in
IE it does not do this. It does not look nice in firefox and I'm sure there
is some way to prevent it. (for some reason it selects it when you click the
menu item and this probably can be turned off using css?)

Another issue, which isn't a big deal, is that I'm using symmetric bitmaps
to "cap" the border. I was wondering if it is possible to flip the image
using html or js so that I don't have to have a seperate image for it?

Thanks,
Jon
Mar 11 '07 #1
Share this Question
Share on Google+
7 Replies


P: n/a
Jon Slaughter said the following on 3/11/2007 3:02 AM:
Can someone point me to some resources on how to tile an image to create a
border?
news:comp.infosystems.www.authoring.stylesheets
<td>
<img src="images/MTile.png" width="1" height="30" alt=""></td>

I have something like that where I need to repeat x times where x depends on
the width of the browser. (Not sure if its a good idea to use a bitmap of
width 1 but I could use one that is larger and then use both(e.g., maybe one
that is 10 pixels wide and repeat that as needed and let the 1 pixel wide
one get the rest(I have some "ends" on the border that I need to display too
so it sorta needs to be exact))

Not sure how to do this with js(just learning it) but obviously I just need
to get the width of the border and then figure out how many times I need to
repeat the code.
CSS is your friend.

<snip>
Another issue, which isn't a big deal, is that I'm using symmetric bitmaps
to "cap" the border. I was wondering if it is possible to flip the image
using html or js so that I don't have to have a seperate image for it?
No.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Mar 11 '07 #2

P: n/a

"Randy Webb" <Hi************@aol.comwrote in message
news:Jc********************@giganews.com...
Jon Slaughter said the following on 3/11/2007 3:02 AM:
>Can someone point me to some resources on how to tile an image to create
a border?

news:comp.infosystems.www.authoring.stylesheets
> <td>
<img src="images/MTile.png" width="1" height="30" alt=""></td>

I have something like that where I need to repeat x times where x depends
on the width of the browser. (Not sure if its a good idea to use a bitmap
of width 1 but I could use one that is larger and then use both(e.g.,
maybe one that is 10 pixels wide and repeat that as needed and let the 1
pixel wide one get the rest(I have some "ends" on the border that I need
to display too so it sorta needs to be exact))

Not sure how to do this with js(just learning it) but obviously I just
need to get the width of the border and then figure out how many times I
need to repeat the code.

CSS is your friend.
Ok, Thanks. I'll look into css and see what I can learn(just beginning with
this stuff and I don't have a clear idea how everything works).

Jon
Mar 11 '07 #3

P: n/a
On Sun, 11 Mar 2007 08:59:29 +0100, Randy Webb <Hi************@aol.com
wrote:
Jon Slaughter said the following on 3/11/2007 3:02 AM:
>Can someone point me to some resources on how to tile an image to
create a border?

news:comp.infosystems.www.authoring.stylesheets
> <td>
<img src="images/MTile.png" width="1" height="30" alt=""></td>
I have something like that where I need to repeat x times where x
depends on the width of the browser. (Not sure if its a good idea to
use a bitmap of width 1 but I could use one that is larger and then use
both(e.g., maybe one that is 10 pixels wide and repeat that as needed
and let the 1 pixel wide one get the rest(I have some "ends" on the
border that I need to display too so it sorta needs to be exact))
Not sure how to do this with js(just learning it) but obviously I just
need to get the width of the border and then figure out how many times
I need to repeat the code.

CSS is your friend.
Yes. Isn't it possible to set it using html only? Although you wouldn't be
able to set the direction of repetition. I know this works for the body
element. Maybe this works for a td element as well?

Something like <td background="myimage.png"&nbsp; </td>

(The non-breaking space is added because some browsers ( *cough* Microfost
Internet Exploder *cough* ) refuse to show empty table cells even when
specifically instructed to show them. )

--
Using Opera's revolutionary e-mail client: http://www.opera.com/mail/
Mar 11 '07 #4

P: n/a
OmegaJunior said the following on 3/11/2007 12:35 PM:
On Sun, 11 Mar 2007 08:59:29 +0100, Randy Webb <Hi************@aol.com>
wrote:
>Jon Slaughter said the following on 3/11/2007 3:02 AM:
>>Can someone point me to some resources on how to tile an image to
create a border?

news:comp.infosystems.www.authoring.stylesheets
>> <td>
<img src="images/MTile.png" width="1" height="30" alt=""></td>
I have something like that where I need to repeat x times where x
depends on the width of the browser. (Not sure if its a good idea to
use a bitmap of width 1 but I could use one that is larger and then
use both(e.g., maybe one that is 10 pixels wide and repeat that as
needed and let the 1 pixel wide one get the rest(I have some "ends"
on the border that I need to display too so it sorta needs to be exact))
Not sure how to do this with js(just learning it) but obviously I
just need to get the width of the border and then figure out how many
times I need to repeat the code.

CSS is your friend.

Yes. Isn't it possible to set it using html only?
I wouldn't know anymore, I stopped using HTML3.2 almost 10 years ago.
Although you wouldn't be able to set the direction of repetition.
I know this works for the body element. Maybe this works for a td
element as well?
Did you test it?
Something like <td background="myimage.png"&nbsp; </td>
Like I said, I stopped using HTML 3.2 almost 10 years ago.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Mar 11 '07 #5

P: n/a
"Jon Slaughter" <Jo***********@Hotmail.comwrote in news:LPNIh.9212
$j*******@newssvr25.news.prodigy.net:
I was wondering if it is possible to flip the image
using html or js
Using CSS, actually, using "filter:flipv;".

http://www.google.com/search?q=css+filter+flipv

Or fliph if you prefer. Or both.
Mar 12 '07 #6

P: n/a
On Sun, 11 Mar 2007 20:02:21 +0100, Randy Webb <Hi************@aol.com>
wrote:
>
Like I said, I stopped using HTML 3.2 almost 10 years ago.
Never burn ships that sail! With all the browser incompatibilities knowing
good ol' html does come in handy.
--
Using Opera's revolutionary e-mail client: http://www.opera.com/mail/
Mar 12 '07 #7

P: n/a
On Mon, 12 Mar 2007 02:22:18 +0100, Jim Land <RrrrFfffTttt hotmail.com
wrote:
"Jon Slaughter" <Jo***********@Hotmail.comwrote in news:LPNIh.9212
$j*******@newssvr25.news.prodigy.net:
>I was wondering if it is possible to flip the image
using html or js

Using CSS, actually, using "filter:flipv;".

http://www.google.com/search?q=css+filter+flipv

Or fliph if you prefer. Or both.
Yay for MS-only solutions! We all know the internet was invented and owned
by Bill Gates, right?

--
Using Opera's revolutionary e-mail client: http://www.opera.com/mail/
Mar 16 '07 #8

This discussion thread is closed

Replies have been disabled for this discussion.