Where do I insert...?

**gonefishing** · 07-15-2005, 01:58 PM

Well, I guess I posted to the wrong area. I'll try again!

Bumping my head with FP2003...but still reading and trying! Question, after I copy a code from dynamicdrive.com, do I paste it inside the brackets of the designated selection <head> or <body>, or, to the left, right or under these words. And, do I paste over what I have already, or, is this a new page? Did that make any sense to anyone? For example, if I want to do a horizonal drop down menu across the top of the page, do I paste in one of the drop down templates or do I create the words that I want in the menu boxes and then paste the code? Or, second scenario, do I paste a shopping cart into the <body> somewhere or what? I'm so confused. I keep trying to paste and then I can't get my page back to normal and when I delete everything off the page, I think the codes are still somewhere on the page. Is that possible. I get error messages when I try to put info back on the pages.

And then, I may be posting to the wrong area. If so, I'm sorry, I just didn't know which one to choose, so I just went with the general.

Thanks for any help!!!

**jscheuer1** · 07-15-2005, 03:15 PM

You need to be more specific. It depends upon what you are pasting and what you want the result to be. Also, I highly recommend that installing a script be the last thing you do on a page and that you do it in a text editor. Notepad will do if you have none better. Experiment as to placement and pasting over/adding to. Test your page locally in the browser. When you are happy upload your page via FTP or using your server's online interface. Do not load the page back in FP. Although it may be fine, there is a good chance it will wreak it.

Notes:

Only one of each of these tag sets should appear on your page:

<html></html>
<head></head>
<body></body>

With the opening body tag, if you are supposed to put something in the tag itself (usually an onload event), put it right in the tag:

<body onload="neatscript();">

If you have other stuff in there already (like colors, etc.), just add the onload event. When you are finished you should still have just one <body> and just one </body> tag.

**gonefishing** · 07-15-2005, 04:10 PM

So when I install a script, I don't go to the index of the webpage, click on code at the bottom of the page and add the script on the the code page. I went to <body> and inserted the script to the right of the right arrow. I guess that's not right?

You then told me to install script in text editor or notepad. Where's that? Why? Do I install there, save it and then insert the saved page?

Oh, by the way, this in a general question about installing any script. I assumed installing script would work the same way for anything.

I just don't know if I go inside the brackets or outside or where? Is there a book I can buy outside of the FP2003 manual to read about these different techniques? I have 3 books, but none of them talk about basic things, where exactly to put what!

Thanks in advance.

**gonefishing** · 07-15-2005, 06:00 PM

Okay, this is one of the things that I am trying to do! After I copy this information, where do I paste it? The pictures on each page are different, do I apply this function to every individual page? I have no more than 4 pictures on each page.

Image Thumbnail Viewer II
Author: Dynamic Drive
Description: Similar in function to Image Thumbnail Viewer, this script loads and displays a larger image when a thumbnail is clicked on. Great for letting visitors preview from many images then select the image of his choice to view on the same page. Features include:

Configure larger image to be shown via onClick or onMouseover of thumbnail.
Images loaded can vary in dimensions, and can each be independently linked.
Specify whether images should be preloaded. Set to "no" to save on download time and bandwidth.
Define image border and optional link target.
Define multiple regions for different images to be displayed in.
In IE5.5+, an optional fade-wipe effect is applied during each image change.
Script works in all modern DHTML browsers- IE5+, NS6+, and Opera 7+.
Yes, deceptively loaded!

Demos:

Using conventional thumbnail images and activated onMouseover:

--------------------------------------------------------------------------------

Directions

Step 1: Add the following script to the <head> section of your page:

Select All
<script type="text/javascript">

/***********************************************
* Image Thumbnail Viewer II script- © 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
***********************************************/

//Specify image paths and optional link (set link to "" for no link):
var dynimages=new Array()
dynimages[0]=["photo1.jpg", "http://www.cnn.com"]
dynimages[1]=["photo2.jpg", "http://www.yahoo.com"]
dynimages[2]=["photo3.jpg", "http://www.google.com"]

//Preload images ("yes" or "no"):
var preloadimg="no"

//Set optional link target to be added to all images with a link:
var optlinktarget=""

//Set image border width
var imgborderwidth=0

//Optionally, change 1.0 and 0.7 below to affect Wipe gradient size and duration in seconds in IE5.5+:
var filterstring="progid

XImageTransform.Microsoft.GradientWipe(GradientSize=1.0 Duration=0.7)"

///////No need to edit beyond here/////

if (preloadimg=="yes"){
for (x=0; x<dynimages.length; x++){
var myimage=new Image()
myimage.src=dynimages[x][0]
}
}

function returnimgcode(theimg){
var imghtml=""
if (theimg[1]!="")
imghtml='<a href="'+theimg[1]+'" target="'+optlinktarget+'">'
imghtml+='<img src="'+theimg[0]+'" border="'+imgborderwidth+'">'
if (theimg[1]!="")
imghtml+='</a>'
return imghtml
}

function modifyimage(loadarea, imgindex){
if (document.getElementById){
var imgobj=document.getElementById(loadarea)
if (imgobj.filters && window.createPopup){
imgobj.style.filter=filterstring
imgobj.filters[0].Apply()
}
imgobj.innerHTML=returnimgcode(dynimages[imgindex])
if (imgobj.filters && window.createPopup)
imgobj.filters[0].Play()
return false
}
}

</script>

Be sure to refer to the comments inside to specify the images and more.

Step 2: Add the following example code to the <BODY> section of your page. It illustrates how to set up thumbnails to display their larger counterparts:

Select All
<a href="#" onMouseover="modifyimage('dynloadarea', 0)">image 1 (onmouseover)</a><br>
<a href="#" onMouseover="modifyimage('dynloadarea', 1)">image 2 (onmouseover)</a><br>
<a href="#" onClick="return modifyimage('dynloadarea2', 2)">image 3 (onclick)</a><p>

<div id="dynloadarea" style="width:80px;height:225px"></div>

<div id="dynloadarea2" style="width:80px;height:200px"></div>

As shown, a thumbnail looks something like:

<a href="#" onMouseover="modifyimage('dynloadarea', 0)">image 1</a>Inside function "modifyfunction()", pass in the ID of the DIV tag that will hold the larger image (ie: "dynloadarea"), and following that, the index number of the array element containing the desired image (see code of Step 1).

Also shown is how the DIV tag that will act as the display area of the larger image looks like:

<div id="dynloadarea" style="width:80px;height:225px"></div>You should set the width and height of this DIV to the dimensions of the largest image that will be shown inside it. Move this tag to the desired location on the page where the larger images should be shown.

Finally, if all this is starting to get confusing, don't worry, installing the script is actually much simpler than following the instructions, which are simply there for sake of reference.

**jscheuer1** · 07-16-2005, 01:35 PM

I cannot for the life of me see why you find it necessary to paste in virtually an entire page from this site to make a point. What point?

Slow down, take a few deep breaths. Lay of the caffeine and/or sugar for a little bit.

Start with a 'blank' html page:

Code:

<html>
<head>
<title></title>
</head>
<body>

</body>
</html>

Use a plain text editor (like notepad). Paste the stuff in where it says that it goes. Customize your images into it. Save it as mytestscript.htm, view it in the browser. If you have trouble with it, upload it and your images to your server. Give us the address to it, we will have a look.

Thread: Where do I insert...?

Thread Tools

Search Thread

Where do I insert...?

Where do I insert?

Where do I insert...?

Bookmarks

Bookmarks

Posting Permissions