dd script not working.

**sparkythex** · 10-22-2009, 06:55 AM

1) Script Title: Featured Content Glider

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

3) URL not working location: http://irongun.50webs.com/test2.html/

4) Describe problem: i have two problems all with the same script.

4a) i changed the "prev., 1,2,3,next" to show : "<< Start < Previous | | Next > Last >>" however the "last" doesn't load the last it load pic. 2. (the "start" does seem to load pic one)

4b) i wanted to have the "<< Start < Previous | | Next > Last >>" on the top & bottom. the one on the top works as long as you don't click on the bottom one. however the one on the bottom doesn't move pic at all. if any of the bottom "<< Start < Previous | | Next > Last >>" ; are clicked on, when you go back to the top & hit any "next" starts back at pic#1. if the TOP "Previous" does nothing. if the last is picked it still loads pic#2.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
	<title>My document title</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<link rel="stylesheet" type="text/css" href="featuredcontentglider.css" />

<script type="text/javascript" src="featuredcontentglider.js">

/***********************************************
* Featured Content Glider script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
*   http://www.dynamicdrive.com/dynamicindex17/featuredcontentglider.htm
***********************************************/

</script>
</head>
<body style="color: rgb(255, 255, 255); background-color: rgb(0, 0, 0);" link="#c0c0c0" alink="#99ff99" vlink="#c0c0c0">
<table style="text-align: left; width: 100px; height: 100%;" border="10">

  <tbody>

    <tr>

      <td style="background: url(http://irongun.50webs.com/images/body.jpg) no-repeat; text-align: left; vertical-align: top;">
      <table style="text-align: left; font-family: Arial; width: 100%; height: 565px;" border="0">

        <tbody>

          <tr>

            <td style="vertical-align: bottom; width: 95px; height: 163px;"><!-- to make width i want --> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            </td>

            <td style="vertical-align: bottom; width: 222px; height: 163px;"><img style="width: 225px; height: 1px;" alt="" src="blank.jpg">&nbsp;</td>

            <td style="text-decoration: line-through; width: 501px; vertical-align: bottom; height: 163px;">
               <h1 id="site-title"><strong><a id="sys_heading" href="http://irongun.prophp.org/index.php">Iron Gun</a></strong></h1>
            </td>

          </tr>

          <tr>

            <td style="width: 95px; height: 122px;">&nbsp;&nbsp;</td>

            <td style="width: 222px; height: 122px;">&nbsp;&nbsp;</td>

            <td colspan="1" rowspan="2" style="width: 501px; height: 122px; vertical-align: top;">
            <table style="text-align: left; width: 850px; height: 698px;" border="0" cellpadding="2" cellspacing="2">

              <tbody>

                <tr>

                  <td style="height: 60px;">&nbsp; </td>

                  <td style="height: 60px;"><script type="text/javascript">

featuredcontentglider.init({
	gliderid: "canadaprovinces", //ID of main glider container
	contentclass: "glidecontent", //Shared CSS class name of each glider content
	togglerid: "p-select", //ID of toggler container
	remotecontent: "glidecontent.htm", //Get gliding contents from external file on server? "filename" or "" to disable
	selected: 0, //Default selected content index (0=1st)
	persiststate: false, //Remember last content shown within browser session (true/false)?
	speed: 500, //Glide animation duration (in milliseconds)
	direction: "downup", //set direction of glide: "updown", "downup", "leftright", or "rightleft"
	autorotate: false, //Auto rotate contents (true/false)?
	autorotateconfig: [3000, 2] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]
})

</script>
			<br><!-- start of art menu top -->
&nbsp;<div id="p-select" class="glidecontenttoggler">
<a href="#" class="toc"><< Start</a>
<a href="#" class="prev">< Previous</a> 
 |&nbsp;&nbsp;&nbsp;&nbsp;<a href="/archive.html" onclick="loadHTML(this.href); return false;">Archive</a>&nbsp;&nbsp;&nbsp;&nbsp;| 
<a href="#" class="next">Next ></a>
<a href="#" class="toc">Last >></a>
</div>
		  </td>

                </tr>

                <tr>

                  <td style="width: 83px; height: 630px;"><img style="width: 60px; height: 1px;" alt="" src="blank.jpg">&nbsp;</td>

                  <td style="text-align: left; vertical-align: top; width: 747px; height: 630px;">
<!-- start of art work -->
   <div id="canadaprovinces" class="glidecontentwrapper">
      <div class="glidecontent">&nbsp;</div> <!-- here in case needed for the doc scrolling -->
   </div> <!-- should be end of glidecontentwrapper -->
</td></tr>
	<tr><td>&nbsp;<!-- should be empty --></td>
	    <td>
		<br><!-- start of art menu bottom -->
<div id="p-select" class="glidecontenttoggler">
    <a href="#" class="toc"><< Start</a>
    <a href="#" class="prev">< Previous</a> 
 |&nbsp;&nbsp;&nbsp;&nbsp;<a href="/archive.html" onclick="loadHTML(this.href); return false;">Archive</a>&nbsp;&nbsp;&nbsp;&nbsp;| 
    <a href="#" class="next">Next ></a>
    <a href="#" class="toc">Last >></a>
</div>
<!-- end of art work -->
</td>
                </tr>
              </tbody>
            </table>
            </td>

          </tr>

          <tr>

            <td style="height: 682px; width: 95px;">&nbsp;&nbsp;</td>

            <td style="text-align: left; vertical-align: top; height: 682px; width: 222px;">
            <table style="text-align: left; width: 226px; height: 227px;" border="0" cellpadding="2" cellspacing="2">

              <tbody>

                <tr>

                  <td style="background: transparent url(http://irongun.50webs.com/images/decay-small.jpg) no-repeat scroll 0% 0%; -moz-background-clip: border; -moz-background-origin: padding; -moz-background-inline-policy: continuous; text-align: left; vertical-align: top; width: 179px;" colspan="3">
                  <h2><span style="color: rgb(88, 88, 88);">&nbsp;&nbsp;&nbsp;Menu</span></h2></td>

                </tr>



                <tr>

                  <td style="width: 27px;"><img style="width: 25px; height: 27px;" alt="" src="http://irongun.50webs.com/images/iron-skull.JPG"></td>

                  <td style="width: 179px;"><a href="http://irongun.prophp.org/index.php" title="Comic">Comic</a></td>

                  <td align="left" valign="top"><img style="width: 25px; height: 27px;" alt="" src="http://irongun.50webs.com/images/iron-skull.JPG"> </td>

                </tr>

                <tr>

                  <td style="width: 27px;"></td>

                  <td style="width: 179px;"><a href="http://irongun.prophp.org/Story.php" title="Story">Story</a></td>

                  <td align="left" valign="top"></td>

                </tr>

                <tr>

                  <td style="width: 27px;"></td>

                  <td style="width: 179px;"><a href="http://irongun.prophp.org//Characters.php" title="Characters">Characters</a></td>

                  <td align="left" valign="top"></td>

                </tr>

                <tr>

                  <td style="width: 27px;"></td>

                  <td style="width: 179px;"><a href="http://irongun.prophp.org/Links.php" title="Links">Links</a></td>

                  <td align="left" valign="top"></td>

                </tr>

                <tr>

                  <td style="width: 27px;"></td>

                  <td style="width: 179px;"><a href="http://irongun.prophp.org/About_Me.php" title="About Me">About Me</a></td>

                  <td align="left" valign="top"></td>

                </tr>

                <tr>

                  <td style="width: 27px;"></td>

                  <td style="width: 179px;"><a href="http://irongun.prophp.org/Other_Works.php" title="Other Works">Other Works</a></td>

                  <td align="left" valign="top"></td>

                </tr>

              </tbody>
            </table>

            </td>

          </tr>

        </tbody>
      </table>

      </td>

    </tr>

  </tbody>
</table>

<br>
</body>
</html>

**jscheuer1** · 10-22-2009, 02:39 PM

I don't know about all that, at least not for the moment, as the script isn't working at all on your page. Both the .css and the .js files are not correct, in their places are HTML pages. Replace these files with the actual css and js files respectively.

**sparkythex** · 10-22-2009, 03:03 PM

Originally Posted by jscheuer1

I don't know about all that, at least not for the moment, as the script isn't working at all on your page. Both the .css and the .js files are not correct, in their places are HTML pages. Replace these files with the actual css and js files respectively.

i would NOT say the script doesn't work, the "prev" & "next", both cycles through the pics.

IT JUST HAS ERRORS DOING IT.

i think you should look again, please.

all the files are there & i downloaded them directly from this site.
i cut & pasted directly from the source on "Step 2: Insert the below sample code into the BODY section of your page:"
if I didn't have the script as in the instructions the page would not work all. (i tested this too, i renamed the files i downloaded " 1. featuredcontentglider.css ; 2. featuredcontentglider.js"; just now & it would not work. so i put them back as original name already.)

maybe you missed that i followed "Specifying an external file source for the gliding contents" (http://www.dynamicdrive.com/dynamici...uppliment3.htm)

here are my files that match the source.
http://irongun.50webs.com/featuredcontentglider.css
http://www.dynamicdrive.com/dynamici...tentglider.css
--
http://irongun.50webs.com/featuredcontentglider.js
http://www.dynamicdrive.com/dynamici...ntentglider.js

i set these up just like it shows in the instructions.

Originally Posted by http://www.dynamicdrive.com/dynamicindex17/featuredcontentglider.htm

Set up Information

The code of Step 2 shows how to apply the script to ordinary content on your page:

<script type="text/javascript">

featuredcontentglider.init({
gliderid: "canadaprovinces", //ID of main glider container
contentclass: "glidecontent", //Shared CSS class name of each glider content

THANKS in advance for your continuing hard work on this!!!

**sparkythex** · 10-22-2009, 03:32 PM

Originally Posted by sparkythex

3) URL not working location: http://irongun.50webs.com/test2.html/

just found this odd glitch too.
the "/" at end of "test2.html/" messed up page loading for some reason.

please use URL: http://irongun.50webs.com/test2.html

**jscheuer1** · 10-23-2009, 08:36 AM

OK, I think I've got this one. First we need to make a modification to the featuredcontentglider.js file. There are three places in it where it has:

Code:

#"+config.togglerid

Change all three to:

Code:

."+config.togglerid

Next, change the way the initialization on the page is done. Instead of:

Code:

featuredcontentglider.init({
	gliderid: "canadaprovinces", //ID of main glider container
	contentclass: "glidecontent", //Shared CSS class name of each glider content
	togglerid: "p-select", //ID of toggler container
	remotecontent: "glidecontent.htm", //Get gliding contents from external file on server? "filename" or "" to disable
	selected: 0, //Default selected content index (0=1st)
	persiststate: false, //Remember last content shown within browser session (true/false)?
	speed: 500, //Glide animation duration (in milliseconds)
	direction: "downup", //set direction of glide: "updown", "downup", "leftright", or "rightleft"
	autorotate: false, //Auto rotate contents (true/false)?
	autorotateconfig: [3000, 2] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]
})

Do it like so:

Code:

var myglider = {
	gliderid: "canadaprovinces", //ID of main glider container
	contentclass: "glidecontent", //Shared CSS class name of each glider content
	togglerid: "p-select", //ID of toggler container
	remotecontent: "glidecontent.htm", //Get gliding contents from external file on server? "filename" or "" to disable
	selected: 0, //Default selected content index (0=1st)
	persiststate: false, //Remember last content shown within browser session (true/false)?
	speed: 500, //Glide animation duration (in milliseconds)
	direction: "downup", //set direction of glide: "updown", "downup", "leftright", or "rightleft"
	autorotate: false, //Auto rotate contents (true/false)?
	autorotateconfig: [3000, 2] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]
};
featuredcontentglider.init(myglider);

Now you can have as many toggler divisions of the type you say you want as you like, wherever you like, but the code for them has changed a little. Here's an example:

HTML Code:

<div class="p-select glidecontenttoggler">
<a href="#" onclick="featuredcontentglider.glide(myglider, '0pg'); return false;">First</a> 
<a href="#" class="prev">Prev</a> 
<a href="#" class="next">Next</a> 
<a href="#" onclick="featuredcontentglider.glide(myglider, myglider.$contentdivs.length - 1 + 'pg'); return false;">Last</a>
</div>

**sparkythex** · 10-24-2009, 04:01 AM

this works.
it is so awesome!!!
i have been playing with this for like 3 weeks.

Thread: dd script not working.

Thread Tools

Search Thread

dd script not working.

Bookmarks

Bookmarks

Posting Permissions