How to apply this script into web?

**WSBlue** · 12-28-2009, 07:51 AM

http://www.dynamicdrive.com/dynamici...agemagnify.htm

After copy and paste the Step 1.

How to apply this into web:
The above code references two external files which you should download below (right click, and select "Save As"):

jquery.magnifier.js
magnify.cur (custom magnifier image cursor for IE browsers)

Please help. Thank you.

**jimchicago** · 12-28-2009, 08:56 PM

So, on that DynamicDrive page, you'll want to right-click on the text "jquery.magnifier.js" and select "Save As" and choose a location on your computer (might be best to put it on the desktop) where you can easily find it. Next:

1) log into your Vodahost cPanel
2) click on File Manager
3) In the "File Manager Directory Selection" window, click the last radio button (beside "Document Root For")
4) Just below "Document Root For", click the dropdown menu and choose the domain of the site where you want the DynamicDrive tool to appear. Click the grey "Go" button
5) In the row of icons near the top of the page, click "Upload" icon (looks like a file folder with a green arrow in front of it)
6) On the new page you'll get, click "Choose" and navigate to wherever you saved the "jquery.magnifier.js" file and double click to select it.
7) cPanel should automatically begin uploading the file you selected to the domain you specified.

Repeat this process for the other file that DynamicDrive says you need to upload. Once you have both of them uploaded to the proper directory in your cPanel, you should be able to implement the DynamicDrive tool on a BV page.

**WSBlue** · 12-28-2009, 09:03 PM

Jim,
Thank you, I will try to do it tomorrow.
Merry Christmas & Happy New Year

**WSBlue** · 01-02-2010, 03:33 PM

Originally Posted by jimchicago

So, on that DynamicDrive page, you'll want to right-click on the text "jquery.magnifier.js" and select "Save As" and choose a location on your computer (might be best to put it on the desktop) where you can easily find it. Next:

1) log into your Vodahost cPanel
2) click on File Manager
3) In the "File Manager Directory Selection" window, click the last radio button (beside "Document Root For")
4) Just below "Document Root For", click the dropdown menu and choose the domain of the site where you want the DynamicDrive tool to appear. Click the grey "Go" button
5) In the row of icons near the top of the page, click "Upload" icon (looks like a file folder with a green arrow in front of it)
6) On the new page you'll get, click "Choose" and navigate to wherever you saved the "jquery.magnifier.js" file and double click to select it.
7) cPanel should automatically begin uploading the file you selected to the domain you specified.

Repeat this process for the other file that DynamicDrive says you need to upload. Once you have both of them uploaded to the proper directory in your cPanel, you should be able to implement the DynamicDrive tool on a BV page.

http://www.dynamicdrive.com/dynamici...hmenu.htm#ajax

Step 1: Insert the following code into the <head> section of your page:
<!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">

<link rel="stylesheet" type="text/css" href="ddsmoothmenu.css" />
<link rel="stylesheet" type="text/css" href="ddsmoothmenu-v.css" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript" src="ddsmoothmenu.js">

/***********************************************
* Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

<script type="text/javascript">

ddsmoothmenu.init({
mainmenuid: "smoothmenu1", //menu DIV id
orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu', //class added to menu's outer DIV
//customtheme: ["#1c5a80", "#18374a"],
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})

ddsmoothmenu.init({
mainmenuid: "smoothmenu2", //Menu DIV id
orientation: 'v', //Horizontal or vertical menu: Set to "h" or "v"
classname: 'ddsmoothmenu-v', //class added to menu's outer DIV
//customtheme: ["#804000", "#482400"],
contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})

</script>

The above code references a few external files, which by default you should upload to the same directory as the page itself (right click each file and select "Save As"):
ddsmoothmenu.js
ddsmoothmenu.css
ddsmoothmenu-v.css
2 images:
(I have done this, I can see at FTP)

Step 2: Add the below menu code to the BODY section of your page. It contains the markup for 1 horizontal menu and 1 vertical menu:
<h2>Example 1</h2>

<div id="smoothmenu1" class="ddsmoothmenu">
<ul>
<li><a href="http://www.dynamicdrive.com">Item 1</a></li>
<li><a href="#">Folder 0</a>
<ul>
<li><a href="#">Sub Item 1.1</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
</ul>
</li>
<li><a href="#">Folder 1</a>
<ul>
<li><a href="#">Sub Item 1.1</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Folder 3.1.1</a>
<ul>
<li><a href="#">Sub Item 3.1.1.1</a></li>
<li><a href="#">Sub Item 3.1.1.2</a></li>
<li><a href="#">Sub Item 3.1.1.3</a></li>
<li><a href="#">Sub Item 3.1.1.4</a></li>
<li><a href="#">Sub Item 3.1.1.5</a></li>
</ul>
</li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://www.dynamicdrive.com/style/">Item 4</a></li>
</ul>
<br style="clear: left" />
</div>

<h2 style="margin-top:200px">Example 2</h2>

<div id="smoothmenu2" class="ddsmoothmenu-v">
<ul>
<li><a href="http://www.dynamicdrive.com">Item 1</a></li>
<li><a href="#">Folder 0</a>
<ul>
<li><a href="#">Sub Item 1.1</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
</ul>
</li>
<li><a href="#">Folder 1</a>
<ul>
<li><a href="#">Sub Item 1.1</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
<li><a href="#">Sub Item 1.2</a></li>
<li><a href="#">Sub Item 1.3</a></li>
<li><a href="#">Sub Item 1.4</a></li>
</ul>
</li>
<li><a href="#">Item 3</a></li>
<li><a href="#">Folder 2</a>
<ul>
<li><a href="#">Sub Item 2.1</a></li>
<li><a href="#">Folder 2.1</a>
<ul>
<li><a href="#">Sub Item 2.1.1</a></li>
<li><a href="#">Sub Item 2.1.2</a></li>
<li><a href="#">Folder 3.1.1</a>
<ul>
<li><a href="#">Sub Item 3.1.1.1</a></li>
<li><a href="#">Sub Item 3.1.1.2</a></li>
<li><a href="#">Sub Item 3.1.1.3</a></li>
<li><a href="#">Sub Item 3.1.1.4</a></li>
<li><a href="#">Sub Item 3.1.1.5</a></li>
</ul>
</li>
<li><a href="#">Sub Item 2.1.4</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://www.dynamicdrive.com/style/">Item 4</a></li>
</ul>
<br style="clear: left" />
</div>

But when preview I see all these or this will work only after published:
Example 1
Item 1
Folder 0
Sub Item 1.1
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Folder 1
Sub Item 1.1
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Item 3
Folder 2
Sub Item 2.1
Folder 2.1
Sub Item 2.1.1
Sub Item 2.1.2
Folder 3.1.1
Sub Item 3.1.1.1
Sub Item 3.1.1.2
Sub Item 3.1.1.3
Sub Item 3.1.1.4
Sub Item 3.1.1.5
Sub Item 2.1.4
Item 4

Example 2

Item 1
Folder 0
Sub Item 1.1
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Folder 1
Sub Item 1.1
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Sub Item 1.2
Sub Item 1.3
Sub Item 1.4
Item 3
Folder 2
Sub Item 2.1
Folder 2.1
Sub Item 2.1.1
Sub Item 2.1.2
Folder 3.1.1
Sub Item 3.1.1.1
Sub Item 3.1.1.2
Sub Item 3.1.1.3
Sub Item 3.1.1.4
Sub Item 3.1.1.5
Sub Item 2.1.4
Item 4

>
Please advise how to apply them correctly.
Thank you.

Thread: How to apply this script into web?

LinkBack

Thread Tools

How to apply this script into web?

Re: How to apply this script into web?

Re: How to apply this script into web?

Re: How to apply this script into web?

Thread Information

Users Browsing this Thread

Posting Permissions