Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Aug 2002
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help! Interactive slide show...

    Hello!
    I installed an interactive slide show for a customer that is supposed to work in all platforms. It works great in IE, but in Netscape, the slides don't show. The page where this is installed is at http://www.bluewtech.com/KBT/plant.htm . If anyone can help me on this I would greatly appreciate it! Thanks.

  • #2
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    On NS4 it looks like the javascript where the slideshow table gets dynamically written overwites the rest of the document, so all you see is the 'welcome' image. Not sure why just yet. Why are some of the tables dynamically written like that? Is that the way it is intended in the slideshow script (is that available to look at with installation instructions from some site?)?... Also, just curious, what does that webbot bot=include thing do?

    G

  • #3
    New Coder
    Join Date
    Aug 2002
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Interactive Slide Show

    Gorrilla 1,
    Thanks for the reply. First, as a last reort I tried putting the viewer on its own page and calling it as a SSI from the plant.htm page. It works without a problem, but it won't run in Netscape. Below is the .js file for the viewer.

    descr=new Array
    w=new Array
    h=new Array
    ratio=new Array
    urls=new Array
    var wmax
    var hmax
    var items
    var showbg
    var buttonbgcolor
    var buttontextcolor
    var descriptionbgcolor
    var textcolor


    //changes area

    items=5 //number of items (image, url and description pairs)
    tablewidth=500 //width of slide show area
    tabheight=350 //height of slide show area

    buttonbgcolor="silver" //background color of buttons
    buttontextcolor="black" //text color for buttons
    descriptionbgcolor="black" //background color of description area
    textcolor="white" //text color of description area
    showbg="showbg.jpg" //background picture for images and buttons area

    //leave blank text color to get black text
    //leave blank background color to get transparent background
    //leave blank showbg to get descriptionbgcolor for background
    //experiment, but make sure you don't delete quotation marks!

    img=new Array
    for(i=1;i<=items;i++)img[i]=new Image()

    //web address for images used in show
    //add or delete here rows to match the number of images;
    //make sure you update the number in the square brackets:
    //the next row should be img[6].src="images/next_image.jpg"
    img[1].src="images/welcome.jpg"
    img[2].src="images/toothmill.jpg"
    img[3].src="images/splinegrind.jpg"
    img[4].src="images/wetgrind.jpg"
    img[5].src="images/formgrind.jpg"
    //img[6].src="Arugot_show.jpg"

    //image sizes, make sure you enter correct values
    //add or delete here rows to match the number of images;
    //make sure you update the number in the square brackets:
    w[1]=250
    h[1]=250
    w[2]=250
    h[2]=250
    w[3]=250
    h[3]=250
    w[4]=250
    h[4]=250
    w[5]=250
    h[5]=250

    //description for each images
    //add or delete here rows to match the number of images;
    //make sure you update the number in the square brackets:

    descr[1]="Welcome to Kingsford Broach and Tool, Inc!"
    descr[2]="Milling deep tooth forms"
    descr[3]="Grinding involute spline broaches"
    descr[4]="OD grinding"
    descr[5]="Precision form grinding using Diaform CNC dressers"
    //descr[6]="A green island in the middle of the desert"

    //link urls for each image
    //add or delete here rows to match the number of images;
    //make sure you update the number in the square brackets:
    //urls[1]="http://www.altavista.com"
    //urls[2]="http://www.excite.com"
    //urls[3]="http://www.yahoo.com"
    //urls[4]="http://www.javascriptcity.com"
    //urls[5]="http://www.goto.com"

    //end of changes area

    for(i=1;i<=items;i++)descr[i]='<font color="' + textcolor + '">' + descr[i] + '</font>'


    for(i=1;i<=items;i++)ratio[i]=h[i]/w[i]
    maxs()

    if(wmax>tablewidth)
    {
    for(i=1;i<=items;i++)
    {
    if(w[i]>tablewidth)
    {
    w[i]=tablewidth
    h[i]=w[i]*ratio[i]
    }
    }
    maxs()
    }

    if(hmax>tabheight)
    {
    for(i=1;i<=items;i++)
    {
    if(h[i]>tabheight)
    {
    h[i]=tabheight
    w[i]=h[i]/ratio[i]
    }
    }
    }
    maxs()


    function maxs()
    {
    hmax=h[1]
    for(j=1;j<=items;j++)
    {
    if(h[j]>hmax)hmax=h[j]
    }
    wmax=h[1]
    for(j=1;j<=items;j++)
    {
    if(w[j]>wmax)wmax=w[j]
    }
    }

    layerLeft = new Array
    layerTop = new Array

    position_layers()

    function position_layers()
    {
    for(i=1;i<=items;i++)
    {
    layerLeft[i] = Math.floor((wmax-w[i])/2);
    layerTop[i] = Math.floor((hmax-h[i])/2);
    }
    }

    document.write('<STYLE TYPE="text/css">')
    document.write('# container {position: relative; z-index: 1; top:0px; left:0px}')
    document.write('.buttons { background: ' + buttonbgcolor + '; color: ' + buttontextcolor + '; font-weight: bold; }')
    if(document.layers)document.write('# description {position: absolute; z-index: 3; top:0px; left:0px;}')

    document.write('#con {position: relative; z-index: 1; top:0px; left:0px}')
    for(i=1;i<=items;i++)
    {
    document.write('#pic'+ i + '{position: absolute; z-index: 1; top:' + layerTop[i] + 'px; left:' + layerLeft[i] + 'px; visibility:hidden}');
    }
    document.write('</style>')


    navtest="KO"
    j=0
    if (document.layers)
    {
    navtest="OK"
    layerRef="document.layers"
    styleDef=""
    }

    if(document.all)
    {
    navtest="OK"
    layerRef="document.all"
    styleDef=".style"
    }

    function start()
    {
    eval(layerRef + '["con"].' + layerRef + '["pic1"]' + styleDef + '.visibility="visible"')
    displayText(1)
    currentcommand="stop"
    j=1
    document.playercomm.stop.disabled=true
    document.playercomm.faster.disabled=true
    document.playercomm.slower.disabled=true
    }
    var rotation
    var rotspeed
    rotspeed=3000

    function rotate()
    {
    for(i=1;i<=items;i++)
    {
    eval(layerRef + '["con"].' + layerRef + '["pic' + i + '"]' + styleDef + '.visibility="hidden"')
    }
    j++
    if(j==0)j=items
    if(j>items)j=1
    eval(layerRef + '["con"].' + layerRef + '["pic' + j + '"]' + styleDef + '.visibility="visible"')
    displayText(j)
    rotation = setTimeout("rotate()",rotspeed)
    }

    function displayText(opt){
    text='<center><b>'+descr[opt]+'</b></center>'

    if(document.layers){
    document.layers["container"].document.layers["description"].document.write(text)
    document.layers["container"].document.layers["description"].document.close();
    }

    if(document.all)
    {
    document.all["description"].innerHTML=text;
    }
    }

    currentcommand="play"
    function player(command)
    {
    if(currentcommand=="play")
    {
    if(command=="stop")
    {
    clearTimeout(rotation)
    currentcommand="stop"
    document.playercomm.stop.disabled=true
    document.playercomm.play.disabled=false
    document.playercomm.faster.disabled=true
    document.playercomm.slower.disabled=true
    document.playercomm.previous.disabled=false
    document.playercomm.next.disabled=false
    }
    }

    if(currentcommand=="stop")
    {
    if(command=="play")
    {
    rotate()
    currentcommand="play"
    document.playercomm.play.disabled=true
    document.playercomm.stop.disabled=false
    document.playercomm.faster.disabled=false
    document.playercomm.slower.disabled=false
    document.playercomm.previous.disabled=true
    document.playercomm.next.disabled=true
    }
    }

    if(command=="next")
    {
    clearTimeout(rotation)
    rotate()
    if(currentcommand=="stop")clearTimeout(rotation)
    }

    if(command=="previous")
    {
    clearTimeout(rotation)
    j=j-2
    rotate()
    if(currentcommand=="stop")clearTimeout(rotation)
    }
    }

    function fasterslower(action)
    {
    if(currentcommand=="play")
    {
    if(action=="faster")
    {
    rotspeed=rotspeed-500
    if (rotspeed<0)rotspeed=0
    }
    if(action=="slower")rotspeed=rotspeed+500
    }
    }

    As I said, it works fine in IE. I am perplexed! Thanks for the help.

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I took a nap sorry... I could the see the code, that was not really the issue. What I wanted to understand is if you got the script from somewhere, did it come with installation instructions? Apart from the slideshow script which you have just shown in your post, why is the table that contains the image written via another script dynamically? It is this piece of code that probably overwites the document in ns.

    g

  • #5
    New Coder
    Join Date
    Aug 2002
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Interactive Slide Show

    Gorilla 1,
    Below is the page code.

    <table border=0>
    <TR>
    <script language="JavaScript">
    <!--
    document.write('<TD BGCOLOR="' + descriptionbgcolor + '">')
    document.write('<table width=100% background="' + showbg + '" border=0><tr><td>')
    //the table hosting the slides
    document.write('<center><table border=0><tr><td width='+ wmax + '>')
    document.write('<div id=con>')

    for(i=1;i<=items;i++)document.write('<div id=pic' + i + '><a href="' + urls[i] + '" target=_blank><img src="' + img[i].src +'" width=' + w[i] + ' height=' + h[i] + ' border=0></a></div>')

    document.write('</div>')
    document.write('<img src="images/spacer20.gif" width=' + wmax + ' height=1>')
    document.write('<img src="images/spacer20.gif" height=' + hmax + ' width=1>')
    document.write('</td></tr>')
    document.write('</table></center>')//end of slides
    document.write('</td></tr></table></center>') //end of show area
    //descriptions
    document.write('<table border=0><tr><td width=' + tablewidth + ' height=40 valign=top>')//description area

    document.write('<div id=container><center>')
    document.write('<div id=description><center><img src="images/spacer20.gif" width=' + (tablewidth) + ' height=1 border=1>')
    //-->
    </script>

    <br><FONT color = "#000000"><b>Simple Slide Show</b></font></center></div>
    </center>
    </div>
    </td></tr>
    </table>
    </center>

    <script language="JavaScript">
    <!--
    document.write('<table background="' + showbg + '" width=100%>')
    //-->
    </script>

    <form name=playercomm>
    <tr><td align=center>
    <input name=play value=" Play " type=button class=buttons onClick='player("play")'>
    <input name=faster value=" Faster " type=button class=buttons onClick='fasterslower("faster")'>
    <input name=slower value=" Slower " type=button class=buttons onClick='fasterslower("slower")'>
    <input name=stop value=" Stop " type=button class=buttons onClick='player("stop")'><br>
    <input name=previous value=" << Previous " type=button class=buttons onClick='player("previous")'>
    <input name=next value=" Next >> " type=button class=buttons onClick='player("next")'>
    </td></tr>
    </form>
    </table>
    </center>
    </TD></TR></TABLE>

    Thanks!

  • #6
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    OK, I got it to work in both ie and ns now, simply by stripping away all the code except for the table that contains the slideshow. So that says that NS has no problem with the slideshow itself - there must be some conflict elsewhere in the code that NS trips on. I suspect something to do with multiple background specifications? Hold on, I will look further.

    G

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, if you take out the slidewhow, the code loads fine in IE but loads a blank page in NS, so NS chokes on something completely outside the slideshow. Here is the code I used:

    <html>

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <meta name="GENERATOR" content="Microsoft FrontPage 4.0">
    <meta name="ProgId" content="FrontPage.Editor.Document">
    <title>Production Facilities</title>

    <link rel="stylesheet" type="text/css" href="menu.css">
    <SCRIPT language="JavaScript" SRC="interactshow.js"></SCRIPT>
    </head>

    <body topmargin="0" leftmargin="0" >
    <div align="left">
    <table border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="#FFFFFF">
    <tr>
    <td width="180" colspan="3" valign="top" align="left" rowspan="2"><img border="0" src="images/Logo2.gif" width="180" height="180"></td>
    <td valign="top" align="left" width="100%" bgcolor="#006699"><img border="0" src="images/Header.jpg" width="550" height="150"></td>
    </tr>
    <tr>
    <td valign="top" align="center" bgcolor="#0098D0" width="100%"><img border="0" src="images/test3.gif" width="600" height="30"></td>
    </tr>
    <tr>
    <td width="25" bgcolor="#0098D0"><img border="0" src="images/25shim.gif" width="25" height="25"></td>
    <td width="130" valign="top" align="center" bgcolor="#006699"><!--webbot bot="Include"
    U-Include="side_bar.htm" TAG="BODY" startspan -->
    <div align="center">
    <center>
    <table border="0" cellpadding="3" cellspacing="0" width="130" background="images/sidebar4.gif" height="100">
    <tr>
    <td width="130" height="600" valign="top" align="center">
    <div align="center">
    <table border="0" cellpadding="3" cellspacing="0" width="110">
    <tr>
    <td align="center"><font face="Verdana" size="3" color="#FFFFFF"><b>ISO
    9001<br>
    CERTIFIED</b></font></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    <tr>
    <td align="left"><b><a href="home.htm"><font face="Verdana" size="2">Home</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="plant.htm"><font face="Verdana" size="2">Our
    Plant</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="products.htm"><font face="Verdana" size="2">Products</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="capabilities.htm"><font face="Verdana" size="2">Capabilities</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="services.htm"><font face="Verdana" size="2">Services</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="quality.htm"><font face="Verdana" size="2">Quality</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="engineering.htm"><font face="Verdana" size="2">Engineering</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="stk_keyways.htm"><font face="Verdana" size="2">Stock
    Keyways</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="rfq.htm"><font face="Verdana" size="2">RFQ</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="pullers.htm"><font face="Verdana" size="2">Pullers</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="radius_gages.htm"><font face="Verdana" size="2">Radius
    Gauges</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="turnkey.htm"><font face="Verdana" size="2">Turnkey
    Systems</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="kcoat.htm" ><font face="Verdana" size="2">&quot;K&quot;
    Coat</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="employment.htm"><font face="Verdana" size="2">Employment</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="request.htm"><font face="Verdana" size="2">Information
    Request</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="contact.htm"><font face="Verdana" size="2">Contact</font></a></b></td>
    </tr>
    <tr>
    <td align="center"><font color="#FFFFFF" face="Verdana" size="2">Member</font><br>
    <img border="0" src="images/CTI.jpg" width="110" height="29"></td>
    </tr>
    <tr>
    <td align="center"><font color="#FFFFFF" size="1">United States
    Cutting Tool Institute</font></td>
    </tr>
    <tr>
    <td align="center"><img border="0" src="images/mta2.jpg" width="85" height="50"></td>
    </tr>
    <tr>
    <td align="center"><font color="#FFFFFF" size="1">Michigan Tooling
    Association</font></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    </table>
    </div>
    <p>&nbsp;
    </td>
    </tr>
    </table>
    </center>
    </div>
    <!--webbot bot="Include" endspan i-checksum="16297" -->
    </td>
    <td width="25"></td>
    <td width="100%" align="center" valign="top">
    <div align="center">
    <center>
    <table border="0" cellpadding="3" cellspacing="0" width="95%" height="100%">
    <tr>
    <td width="100%" align="center">
    <div align="center">
    <center>
    <table border="0" cellpadding="3" cellspacing="0" width="500">
    <tr>
    <td align="center"><font face="Verdana" size="4">A Quick Tour of
    Kingsford Broach and Tool, Inc.<br>
    <br>
    </font></td>
    </tr>
    <tr>
    <td><font face="Verdana" size="2">For a quick tour of our
    facilities, please use the control panel below. If you have any
    questions, comments, or need more information, <a href="contact.htm">CLICK
    HERE</a> for our contact directory. </font><br>
    </td>
    </tr>
    </table>
    </center>
    </div>
    </td>
    </tr>
    <tr>
    <td width="100%">
    <div align="center">
    <center>
    <table border="1" cellpadding="3" cellspacing="0" width="500">
    <tr>
    <td valign="top"><!--webbot bot="Include" U-Include="slide.htm" TAG="BODY" startspan -->

    <center>
    <center>
    <table border="0" cellpadding="3" cellspacing="0" width="500">
    <tr>
    <td align="center">
    <div align="center">
    <center>
    <table border=0>
    <TR><td>hello

    </td>
    </tr>
    </form>
    </table>

    <!--webbot bot="Include" endspan i-checksum="57431" -->
    </td>
    </tr>
    </table>
    </center>
    </div>
    </td>
    </tr>
    <tr>
    <td width="100%"></td>
    </tr>
    <tr>
    <td width="100%" align="center"></td>
    </tr>
    </table>
    </center>
    </div>
    </td>
    </tr>
    </table>
    </div>
    </body>

    </html>

  • #8
    New Coder
    Join Date
    Aug 2002
    Posts
    11
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Interactive Slide Show

    G.

    I loaded that code and it shows the page in bothe IE and NS6, but the slide show will not work. Thanks for trying! Bluetech

  • #9
    Regular Coder
    Join Date
    Jun 2002
    Posts
    553
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Well, ok, works in ns4, but I don't have ns6. It looks to me as though the NS problem is in this piece of sidebar code (ns4 anyway) - I cant see what it is, so I think you have to just reduce the code until you pin down where it breaks, or maybe someone else can spot it:

    <tr>
    <td width="25" bgcolor="#0098D0"><img border="0" src="images/25shim.gif" width="25" height="25"></td>
    <td width="130" valign="top" align="center" bgcolor="#006699"><!--webbot bot="Include"
    U-Include="side_bar.htm" TAG="BODY" startspan -->
    <div align="center">
    <center>
    <table border="0" cellpadding="3" cellspacing="0" width="130" background="images/sidebar4.gif" height="100">
    <tr>
    <td width="130" height="600" valign="top" align="center">
    <div align="center">
    <table border="0" cellpadding="3" cellspacing="0" width="110">
    <tr>
    <td align="center"><font face="Verdana" size="3" color="#FFFFFF"><b>ISO
    9001<br>
    CERTIFIED</b></font></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    <tr>
    <td align="left"><b><a href="home.htm"><font face="Verdana" size="2">Home</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="plant.htm"><font face="Verdana" size="2">Our
    Plant</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="products.htm"><font face="Verdana" size="2">Products</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="capabilities.htm"><font face="Verdana" size="2">Capabilities</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="services.htm"><font face="Verdana" size="2">Services</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="quality.htm"><font face="Verdana" size="2">Quality</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="engineering.htm"><font face="Verdana" size="2">Engineering</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="stk_keyways.htm"><font face="Verdana" size="2">Stock
    Keyways</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="rfq.htm"><font face="Verdana" size="2">RFQ</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="pullers.htm"><font face="Verdana" size="2">Pullers</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="radius_gages.htm"><font face="Verdana" size="2">Radius
    Gauges</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="turnkey.htm"><font face="Verdana" size="2">Turnkey
    Systems</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="kcoat.htm" ><font face="Verdana" size="2">&quot;K&quot;
    Coat</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="employment.htm"><font face="Verdana" size="2">Employment</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="request.htm"><font face="Verdana" size="2">Information
    Request</font></a></b></td>
    </tr>
    <tr>
    <td align="left"><b><a href="contact.htm"><font face="Verdana" size="2">Contact</font></a></b></td>
    </tr>
    <tr>
    <td align="center"><font color="#FFFFFF" face="Verdana" size="2">Member</font><br>
    <img border="0" src="images/CTI.jpg" width="110" height="29"></td>
    </tr>
    <tr>
    <td align="center"><font color="#FFFFFF" size="1">United States
    Cutting Tool Institute</font></td>
    </tr>
    <tr>
    <td align="center"><img border="0" src="images/mta2.jpg" width="85" height="50"></td>
    </tr>
    <tr>
    <td align="center"><font color="#FFFFFF" size="1">Michigan Tooling
    Association</font></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    <tr>
    <td align="center"></td>
    </tr>
    </table>
    </div>
    <p>&nbsp;
    </td>
    </tr>
    </table>
    </center>
    </div>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •