SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast
    Join Date
    Nov 2006
    Posts
    62
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question HELP!Need a genius's help adding text to my slideshow

    I have come across a slideshow I want to use on my site. I am using coldfusion to write the site, but know very little javascript. I cannot figure out how to get the text to show up and change with each slide. I am posting all of my code. I think I may have to use the same functions to change the text as the pics?, but not sure.
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    <html>
    <head>
    	<title>Untitled</title>
    </head>
    <body>
    <table>
    <script language="JavaScript">
    <!--
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    
    function MM_findObj(n, d) { //v4.0
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && document.getElementById) x=document.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    <!-- Begin
    
    //3-way slideshow- by Suzanne Arnold (http://jandr.com/, suzanne@mail.jandr.com)
    //Script featured on JavaScript Kit (http://javascriptkit.com)
    //Credit must stay intact
    
    var Onerotate_delay = 3000; // delay in milliseconds (5000 = 5 secs)
    Onecurrent = 0;
    var OneLinks = new Array(3);
    OneLinks[0] = "#";
    OneLinks[1] = "#";
    OneLinks[2] = "#";
    
    function Onenext() {
    if (document.Oneslideform.Oneslide[Onecurrent+1]) {
    document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent+1].value;
    document.Oneslideform.Oneslide.selectedIndex = ++Onecurrent;
       }
    else Onefirst();
    }
    function Oneprevious() {
    if (Onecurrent-1 >= 0) {
    document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent-1].value;
    document.Oneslideform.Oneslide.selectedIndex = --Onecurrent;
       }
    else Onelast();
    }
    function Onefirst() {
    Onecurrent = 0;
    document.images.Oneshow.src = document.Oneslideform.Oneslide[0].value;
    document.Oneslideform.Oneslide.selectedIndex = 0;
    }
    function Onelast() {
    Onecurrent = document.Oneslideform.Oneslide.length-1;
    document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;
    document.Oneslideform.Oneslide.selectedIndex = Onecurrent;
    }
    function Oneap(text) {
    document.Oneslideform.Oneslidebutton.value = (text == "Stop Slides") ? "Start Slides" : "Stop Slides";
    Onerotate();
    }
    function Onechange() {
    Onecurrent = document.Oneslideform.Oneslide.selectedIndex;
    document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;
    }
    function Onerotate() {
    if (document.Oneslideform.Oneslidebutton.value == "Stop Slides") {
    Onecurrent = (Onecurrent == document.Oneslideform.Oneslide.length-1) ? 0 : Onecurrent+1;
    document.images.Oneshow.src = document.Oneslideform.Oneslide[Onecurrent].value;
    document.Oneslideform.Oneslide.selectedIndex = Onecurrent;
    window.setTimeout("Onerotate()", Onerotate_delay);
    }
    }
    function Onetransport(){
    window.location=OneLinks[Onecurrent]
    }
    //  End -->
    
    function MM_openBrWindow(theURL,winName,features) { //v2.0
      window.open(theURL,winName,features);
    }
    //-->
    </script>
    
    <CFQUERY DATASOURCE="#DSN#" NAME="getcats">
    	SELECT * from category
    	ORDER BY category
    </CFQUERY>
    
    <Cfoutput query="getcats">
    
    <CFQUERY DATASOURCE="#DSN#" NAME="getsub">
    	SELECT * from subcategory
    	where catid = '#catid#'
    </CFQUERY>
    
    <CFQUERY DATASOURCE="#DSN#" NAME="showitems">
    	SELECT * from catproducts1
    	where category  = '#category#'
    </CFQUERY>
    
    <CFQUERY DATASOURCE="#DSN#" NAME="descrip">
    	SELECT * from catproducts1
    	where description  = description
    </CFQUERY>
    
    <cfif getsub.recordcount gt 0>
    <cfif showitems.recordcount gt 0>
    <a href="photogallery2.cfm?catid=#catid#&showall=&catname=#urlencodedformat(getsub.catname)#<cfif getsub.recordcount gt 0>&showsub=</cfif>"><font face="Verdana" size="1">#category#</font></a> | 
    </cfif>
    
    <Cfelse>
    <cfif showitems.recordcount gt 0>
    <a href="photogallery2.cfm?category=#trim(urlencodedformat(category))#&showitem="><font face="Verdana" size="1">#category#</font></a> | 
    </cfif>
    </cfif>
    
    </CFOUTPUT>
    
    </td>
    </tr>
    
    <tr>
    <td>
    
    <Cfif parameterexists(showall)>
    <CFQUERY NAME="GetList" DATASOURCE="#DSN#">	
    SELECT * From catproducts1
    <cfif parameterexists(url.category)>where catgory = '#url.category#'</cfif>
    Order by Sort_order
    </CFQUERY>
    <CFQUERY DATASOURCE="#DSN#" NAME="descrip">
    	SELECT * from catproducts1
    	where description  = description
    </CFQUERY>
    
    <center>
              <form name="Oneslideform"> <table border="0" cellspacing="0" cellpadding="0" align="center">
      <table>         
    					
    							    <TR>
        <TD>
                
           
                  </TD>
                </TR>
    			
    	 <cfoutput query="descrip" maxrows=1>
    			<TR>
                  <TD>
                 #description#
                  </TD>
                </TR></cfoutput>
    			
    			
                <TR>
                  <TD>
                    <DIV align="center"><A href="javascript:Onetransport()"><cfoutput query="GetList" maxrows=1>  <IMG src="backend/admin/catproducts1images/#GetList.photo#" name="Oneshow" border="0"></cfoutput></A></DIV>
                  </TD>
                </TR>
               <TR>
                                                <TD>
    																						<br> 
                                                  <DIV align="center">
                      <INPUT type=button onClick="Oneprevious();" value="<< Back" title="Previous">
                      <INPUT type=button name="Oneslidebutton" onClick="Oneap(this.value);" value="Start Slides" title="Start Slides">
                      <INPUT type=button onClick="Onenext();" value="Next >>" title="Next">
                                                  </DIV><br>
                  <DIV align="center"><B><FONT color="##FFFFFF">
    	   <SELECT name="Oneslide" onChange="Onechange();">
    	   <cfoutput query="GetList">                    
    					<option value="backend/admin/catproducts1images/#GetList.photo#">#GetList.Title#</option>
    					</cfoutput>
    				
                                           </SELECT>
                                                    </FONT></B></DIV><br>
    			  </TD>
                </TR>
              </TABLE>
    		   </center>
          </form>
    
    
    <cfelseif  parameterexists(showitem)>
    
    
    
    
    <CFQUERY DATASOURCE="#DSN#" NAME="GetList">
    	SELECT * from catproducts1
    		where category  = '#url.category#'
    </CFQUERY>
    <CFQUERY DATASOURCE="#DSN#" NAME="descrip">
    	SELECT * from catproducts1
    	
    </CFQUERY>
    
    
    
    <center>
              <form name="Oneslideform"> <table border="0" cellspacing="0" cellpadding="0" align="center">
      <table>         
    					
    							    <TR>
        <TD>
                
           
                  </TD>
                </TR>
    			 <cfoutput query="descrip" maxrows=1>
    			<TR>
                  <TD>
                 #description#
                  </TD>
                </TR></cfoutput>
                
    			<TR>
                  <TD>
                    <DIV align="center"><A href="javascript:Onetransport()"><cfoutput query="GetList" maxrows=1>  <IMG src="backend/admin/catproducts1images/#GetList.photo#" name="Oneshow" border="0"></cfoutput></A></DIV>
                  </TD>
                </TR>
               <TR>
                                                <TD>
    																						<br> 
                                                  <DIV align="center">
                      <INPUT type=button onClick="Oneprevious();" value="<< Back" title="Previous">
                      <INPUT type=button name="Oneslidebutton" onClick="Oneap(this.value);" value="Start Slides" title="Start Slides">
                      <INPUT type=button onClick="Onenext();" value="Next >>" title="Next">
                                                  </DIV><br>
                  <DIV align="center"><B><FONT color="##FFFFFF">
    	   <SELECT name="Oneslide" onChange="Onechange();">
    	   <cfoutput query="GetList">                    
    					<option value="backend/admin/catproducts1images/#GetList.photo#">#GetList.Title#</option>
    					</cfoutput>
    					
                                           </SELECT>
                                                    </FONT></B></DIV><br>
    			  </TD>
                </TR>
              </TABLE>
    		   </center>
          </form>
    
    	  
    	  </CFIF>
    
    
    </td>
    
    </tr>
    </table>
    </body></html>
    Last edited by shaggysc96; Apr 6, 2007 at 11:32.

  2. #2
    SitePoint Addict jtrelfa's Avatar
    Join Date
    Oct 2004
    Location
    Troy, Mi
    Posts
    231
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My suggestions:
    1. Start with valid markup - you're using deprecated HTML and a mixture of upper and lowercase and..well...a lot of things aren't right
    2. Make sure your document has a doctype - force the browser into standards compliance mode
    3. give yourself a 'barebones' start - only put the code in there you absolutely need
    4. follow the code you've borrowed and try to figure out what it's doing. Javascript isn't a mystery. It's just another programming language.
    5. Yes...you will need to figure out a way to pass a text parameter to have it display under the image.


    There are better image galleries out there (that use valid markup). Take a look a jquery - it's a powerful library to help make your javascripting easier - plus there are image gallery plugins built just for it:

    http://docs.jquery.com/Plugins#Image_galleries
    var me = null;


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
  •