Results 1 to 5 of 5

Thread: Need Help With Swiss Army Image Slide & Firefox

  1. #1
    Join Date
    Jun 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Need Help With Swiss Army Image Slide & Firefox

    1) Script Title: Swiss Army Image Slideshow

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...army/index.htm

    3) Describe problem: This is my first post to the Forum, so hopefully I can provide the right details and get an answer as soon as possible. I have installed the Swiss Army Image Slideshow, centered within a web page, and it works fine in IE. However, in Firefox, it is off center as far to the right as possible. I have it in a table, which is centered, but I cannot get it to show centered when viewing in Firefox. Any thoughts?

    Thank you.

  2. #2
    Join Date
    May 2012
    Location
    Hitchhiking the Galaxy
    Posts
    1,013
    Thanks
    46
    Thanked 139 Times in 139 Posts
    Blog Entries
    1

    Default

    Quote Originally Posted by Candleman View Post
    1) Script Title: Swiss Army Image Slideshow

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...army/index.htm

    3) Describe problem: This is my first post to the Forum, so hopefully I can provide the right details and get an answer as soon as possible. I have installed the Swiss Army Image Slideshow, centered within a web page, and it works fine in IE. However, in Firefox, it is off center as far to the right as possible. I have it in a table, which is centered, but I cannot get it to show centered when viewing in Firefox. Any thoughts?

    Thank you.
    Welcome to the forums candleman! One quick question, how are you centering the table? Could you possibly post the code?

  3. #3
    Join Date
    Jun 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thank you Bernie for your quick response. The code for the entire test page I moved it to is below. The script contained three different slides and perhaps I haven't removed all of the unwanted.

    Thanks for any help
    C-Man

    Code:
    <head>
    <meta http-equiv="Content-Language" content="en-us">
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>FF Slide Test</title>
    <style type="text/css">
    
    /* All Styles Optional */
    
    * {
    font-family:arial;
    font-size:10pt;
    }
    div#show3 {
    background-color:#efefef;
    width:140px;
    margin:0 auto;
    border:0px solid #444444;
    }
    div#show3 table td, div#show4 table td {
    height:24px;
    background-image:url('38.gif');
    }
    div#show4 table td {
    background-image:url('40.gif');
    }
    div#show3 table input,  div#show4 table input {
    outline-style:none;
    }
    </style>
    
    <!--[if IE]>
    <style type="text/css">
    div#show3 table td, div#show4 table td {
    height:21px;
    }
    </style>
    <![endif]-->
    
    <script type="text/javascript">
    
    //If using image buttons as controls, Set image buttons' image preload here true
    //(use false for no preloading and for when using no image buttons as controls):
    var preload_ctrl_images=true;
    
    //And configure the image buttons' images here:
    var previmg='images/left.gif';
    var stopimg='images/stop.gif';
    var playimg='images/play.gif';
    var nextimg='images/right.gif';
    
    var slides3=[]; //THIRD SLIDESHOW
    //configure the below images and descriptions to your own, note optional links, target and window specifications. 
    slides3[0] = ["images/HP Slide Image 1.jpg", ""];
    slides3[1] = ["images/HP Slide Image 2.jpg", ""];
    slides3[2] = ["images/HP Slide Image 3.jpg", ""];
    slides3[3] = ["images/HP Slide Image 4.jpg", ""];
    //optional properties for these images:
    slides3.no_descriptions=1; //use for no descriptions displayed
    slides3.pause=1; //use for pause onmouseover
    slides3.image_controls=1; //use images for controls
    slides3.button_highlight='#cccccc'; //onmouseover background-color for image buttons (requires image_controls=1)
    slides3.specs='width=815, height=295' //global specifications for this show's new window(s)
    slides3.random=0; //set a random slide sequence on each page load
    slides3.manual_start=0; //start show in manual mode (stopped)
    
    //Notes:
    //slides#.target will set a target for a slide group, will be overridden by slides#[#][3], if present
    //slides#.specs will set new window specifications for a slide group, will be overridden by slides#[#][4], if present
    //slides#.fadecolor will set fading images background color, defaults to white
    //slides#.no_controls will set a slide show with no controls
    //slides#.random will set a random slide sequence on each page load
    //slides#.delay=3000 will set miliseconds delay between slides for a given show, may also be set in the call as the last parameter
    //slides#.jumpto=1 will display added controls to jump to a particular image by its number
    //slides#.no_added_linebreaks=1; use for no added line breaks in formatting of texts and controls
    
    //use below to create a customized onclick event for linked images in a given show:
    //slides#.onclick="window.open(this.href,this.target,'top=0, left=0, width='+screen.availWidth+', height='+screen.availHeight);return false;"
    
    </script>
    
    <script src="swissarmy.js" type="text/javascript">
    
    /***********************************************
    * Swiss Army Image slide show script  -  John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
    ***********************************************/
    
    </script>
    </head>
    
    <body>
    
    <div align="center">
    	<table border="0" cellpadding="0" cellspacing="0" width="1000">
    		<tr>
    			<td>
    
    <div align="center">
    
    <table border="0" cellpadding="0" cellspacing="0" width="815">
    	<tr>
    		<td height="35"></td>
    	</tr>
    	<tr>
    		<td height="295">
    		<p align="center">
    		<p>
    <script type="text/javascript">
    //Notes on Parameters: The only required parameter is the slides_array_name.  If Width is used, so must Height.
    //Interval is optional too.  It is always last, either fourth after Width and Height or second after Slides_array_name.
    //Usage: new inter_slide(Slides_array_name, Width, Height, Interval)
    new inter_slide(slides)
    </script>
    									</p>
    		<p>
    <script type="text/javascript">
    new inter_slide(slides2)
    </script>
    									</p>
    		<p>
    		<div id="show3"><script type="text/javascript">
    new inter_slide(slides3)
    </script>
    									</div>
    		<p align="center"></p></td>
    	</tr>
    </table>
    
    			</div>
    
    			</td>
    		</tr>
    	</table>
    </div>
    
    </body>
    
    </html>
    Last edited by jscheuer1; 06-23-2012 at 10:55 AM. Reason: Format

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Something like:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <head>
    <meta http-equiv="Content-Language" content="en-us">
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>FF Slide Test</title>
    <style type="text/css">
    
    /* All Styles Optional */
    
    * {
    font-family:arial;
    font-size:10pt;
    }
    
    div#show3 {
    margin:0 auto;
    }
    
    table {margin: 0 auto;}
    </style>
    
    <script type="text/javascript">
    
    //If using image buttons as controls, Set image buttons' image preload here true
    //(use false for no preloading and for when using no image buttons as controls):
    var preload_ctrl_images=true;
    
    //And configure the image buttons' images here:
    var previmg='images/left.gif';
    var stopimg='images/stop.gif';
    var playimg='images/play.gif';
    var nextimg='images/right.gif';
    
    var slides3=[]; //THIRD SLIDESHOW
    //configure the below images and descriptions to your own, note optional links, target and window specifications. 
    slides3[0] = ["images/HP Slide Image 1.jpg", "1"];
    slides3[1] = ["images/HP Slide Image 2.jpg", "2"];
    slides3[2] = ["images/HP Slide Image 3.jpg", "3"];
    slides3[3] = ["images/HP Slide Image 4.jpg", "4"];
    //optional properties for these images:
    slides3.no_descriptions=1; //use for no descriptions displayed
    slides3.pause=1; //use for pause onmouseover
    slides3.image_controls=1; //use images for controls
    slides3.button_highlight='#cccccc'; //onmouseover background-color for image buttons (requires image_controls=1)
    slides3.specs='width=815, height=295' //global specifications for this show's new window(s)
    slides3.random=0; //set a random slide sequence on each page load
    slides3.manual_start=0; //start show in manual mode (stopped)
    
    //Notes:
    //slides#.target will set a target for a slide group, will be overridden by slides#[#][3], if present
    //slides#.specs will set new window specifications for a slide group, will be overridden by slides#[#][4], if present
    //slides#.fadecolor will set fading images background color, defaults to white
    //slides#.no_controls will set a slide show with no controls
    //slides#.random will set a random slide sequence on each page load
    //slides#.delay=3000 will set miliseconds delay between slides for a given show, may also be set in the call as the last parameter
    //slides#.jumpto=1 will display added controls to jump to a particular image by its number
    //slides#.no_added_linebreaks=1; use for no added line breaks in formatting of texts and controls
    
    //use below to create a customized onclick event for linked images in a given show:
    //slides#.onclick="window.open(this.href,this.target,'top=0, left=0, width='+screen.availWidth+', height='+screen.availHeight);return false;"
    
    </script>
    
    <script src="swissarmy.js" type="text/javascript">
    
    /***********************************************
    * Swiss Army Image slide show script  -  John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
    ***********************************************/
    
    </script>
    </head>
    
    <body>
    
    <div>
    	<table border="0" cellpadding="0" cellspacing="0" width="1000">
    		<tr>
    			<td>
    
    <div>
    
    <table border="0" cellpadding="0" cellspacing="0" width="815">
    	<tr>
    		<td height="35"></td>
    	</tr>
    	<tr>
    		<td height="295">
    		<div id="show3"><script type="text/javascript">
    		new inter_slide(slides3, 300, 300)
    		</script>
    		</div>
    		</td>
    	</tr>
    </table>
    
    			</div>
    
    			</td>
    		</tr>
    	</table>
    </div>
    
    </body>
    
    </html>
    You might need to bring back some of the optional styles in order to get the image controls to look right. Or you could always go with the default buttons by commenting out this line:

    Code:
    slides3.image_controls=1; //use images for controls
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. The Following User Says Thank You to jscheuer1 For This Useful Post:

    Candleman (06-23-2012)

  6. #5
    Join Date
    Jun 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Smile Thank You!!!

    Thank you so much ...you were right on the money. It works perfectly!

Bookmarks

Posting Permissions

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