Offscreen image without scrollbars

[Jeff Adams]

I have a set of images that I'm moving around with javascript. When one of
them moves off the screen a scrollbar appears. Is there a way to set it so
that these images don't cause scrollbars to appear?

Thanks

 

[Neredbojias]

With neither quill nor qualm, Jeff Adams quothed:

I have a set of images that I'm moving around with javascript. When one of
them moves off the screen a scrollbar appears. Is there a way to set it so
that these images don't cause scrollbars to appear?

Depends. Background images do not cause scrollbars... Also,
overflow:hidden; styled on the container would prevent scrollbars from
ever appearing.

 

[Jeff Adams]

Depends. Background images do not cause scrollbars... Also,

overflow:hidden; styled on the container would prevent scrollbars from
ever appearing.

But can't you only have one background image? The problem with the overflow
is that the page might have content that requires scrolling. I just don't
want these specific images to cause scrolling

 

[Neredbojias]

With neither quill nor qualm, Jeff Adams quothed:

But can't you only have one background image?

One per element, yes.

The problem with the overflow
is that the page might have content that requires scrolling. I just don't
want these specific images to cause scrolling

Well, how many images are there? If you have 100, I doubt anything can
be done. If you have just a few, something probably can be done. The
first thing I would consider is combining the images graphically and
making *it* the body background. If that isn't feasible, other methods
may be useful.

 

[Greg N.]

I have a set of images that I'm moving around with javascript. When one of
them moves off the screen a scrollbar appears. Is there a way to set it so
that these images don't cause scrollbars to appear?

Have a look at the site in my sig, there are lots of pages with images
that exceed the window without scrollbars, for example this page:

http://hothaus.de/greg-tour-2004/ionia.htm

 

[Toby Inkster]

But can't you only have one background image?

Only one per element, yes.

Try:

<img src="foo.jpeg" alt="Foo" height="100" width="160" id="imgfoo">
<img src="bar.jpeg" alt="Bar" height="100" width="160" id="imgbar">

<script type="text/javascript">
function img2bg (i)
{
var e = document.getElementById(i);
var f = e.src;
e.src = null;
e.title = e.alt;
e.alt = '';
e.style.backgroundImage = "url(" + f + ")";
}
img2bg("imgfoo");
img2bg("imgbar");
</script>

The img2bg() function above takes a regular image, blanks it out and then
replaces it with a background image.

Example: http://examples.tobyinkster.co.uk/img2bg