DHTML : A gallery of scrolling images
Contents ]
Dr Benton

Scrolling under Navigator

In order for our effect to work with Netscape, we need to incorporate our images inside our layer. Two functions will help us here:

function regenere_visio2()
{
  if (document.layers)
  {
    document.ns_slider01.visibility="show"
    setTimeout("window.onresize=regenere_visio",450)
    init_visio()
  }
}

et

function init_visio()
{
  document.ns_slider01.document.ns_slider02.document.write('<nobr>'+visio_final+'</nobr>')
  document.ns_slider01.document.ns_slider02.document.close()
  thelength=document.ns_slider01.document.ns_slider02.document.width
  scrollslide()
}

We will first unveil the ns_slider01 layer (.visibility="show") and then fill it with our images with the help of the second function: init_visio().

Navigator and its bugs! Beware of layers with Navigator. It does not support window resizing very well if the page contains layers. The only solution is a short script that forces the browser to refresh the page as soon as a resizing occurs:

    setTimeout("window.onresize=regenere_visio",450)

The init_visio function simply writes the content of the layer on the page through the .document.write function of the document.ns_slider01.document.ns_slider02 object (actually, on the ns_slider02 layer contained in the ns_slider01 layer), by using visio_final which contains the HTML code created dynamically. The following line is used to close the writing request. Unlike Internet Explorer, with Navigator you have to call up the close method. If you omit this, the code output to the page is added to the previously written code instead of replacing it...

We now need to reset the layer scrolling, using the simple scrollside() function. Its role is to regularly offset the ns_slider2 layer by a few pixels to the left. This is not very complicated or original. Now take another look at the result!




  1   2   3   4   5