How to apply this script into web?

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • WSBlue
    Brigadier General

    • Apr 2006
    • 1415
    #1

    How to apply this script into web?

    http://www.dynamicdrive.com/dynamicindex4/imagemagnify.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.
    Tags: None
  • jimchicago
    Major

    • Aug 2006
    • 307
    #2
    Re: How to apply this script into web?

    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.

    Comment

    • WSBlue
      Brigadier General

      • Apr 2006
      • 1415
      #3
      Re: How to apply this script into web?

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

      Comment

      • WSBlue
        Brigadier General

        • Apr 2006
        • 1415
        #4
        Re: How to apply this script into web?

        Originally posted by jimchicago View Post
        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/dynamicindex1/ddsmoothmenu.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.

        Comment

        Previous template Next

        Find your perfect domain name

        Working...
        X