Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Aug 2008
    Location
    Australia
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Importing Menu contents via external javascript file?

    Hi!!

    Wondering if you could help a lady in distress!!!

    I was wondering if there is any possibility at all of possibly placing the menu contents of this:
    http://www.dynamicdrive.com/dynamici...enu-bullet.htm

    Into an external javascript or file rather than having it in the HTML source code?

    I am trying to utilise a menu for a large training site (300+ pages) and finding a navigation is difficult. I've had a look at a few Javascript tree menus, but visually they aren't suitable. I don't particularly want to insert the same menu into 300+ pages, the code starts getting messy with large amounts of content and if I have to make a change then it's a pain in the ***.

    On top of that I'm limited to working within a Interwoven Teamsite template (a bit like having to enter in code straight into this editor without access to the overarching CSS files, page source code etc.)

    I can upload and run external javascripts though.

    Thankyou,

    Pippa

  • #2
    Senior Coder rangana's Avatar
    Join Date
    Feb 2008
    Location
    Cebu City, Philippines
    Posts
    1,752
    Thanks
    65
    Thanked 372 Times in 365 Posts
    The best way I could think of is to use server-side.

    Try PHP include().

    Save the markups involved into on PHP file (try accordion.php):
    PHP Code:
    <div class="arrowlistmenu">

    <
    h3 class="menuheader expandable">CSS Library</h3>
    <
    ul class="categoryitems">
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Horizontal CSS Menus</a></li>
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical CSS Menus</a></li>
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image CSS</a></li>
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form CSS</a></li>
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">DIVs and containers</a></li>
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C7/">Links Buttons</a></li>
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C8/">Other</a></li>
    <
    li><a href="http://www.dynamicdrive.com/style/csslibrary/all/">Browse All</a></li>
    </
    ul>

    <
    h3 class="menuheader expandable">CSS Drive</h3>
    <
    ul class="categoryitems">
    <
    li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
    <
    li><a href="http://www.cssdrive.com/index.php/menudesigns/" class="subexpandable">Menu Gallery</a>
        <
    ul class="subcategoryitems" style="margin-left: 15px">
        <
    li><a href="http://www.cssdrive.com/index.php/main/category/C34/">Blue Color</a></li>
        <
    li><a href="http://www.cssdrive.com/index.php/main/category/C36/">Green Color</a></li>
        <
    li><a href="http://www.cssdrive.com/index.php/main/category/C37/">Orange Color</a></li>
        <
    li><a href="http://www.cssdrive.com/index.php/main/category/C33/">Red Color</a></li>
        <
    li><a href="http://www.cssdrive.com/index.php/main/category/C38/">Brown Color</a></li>
        </
    ul>
    </
    li>
    <
    li><a href="http://www.cssdrive.com/index.php/news/">Web Design News</a></li>
    <
    li><a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a></li>
    <
    li><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Compressor</a></li>
    <
    li><a href="http://www.dynamicdrive.com/forums/forumdisplay.php?f=6">CSS Forums</a></li>
    </
    ul>

    <
    h3 class="menuheader expandable">JavaScript Kit</h3>
    <
    ul class="categoryitems">
    <
    li><a href="http://www.javascriptkit.com/cutpastejava.shtml" >Free JavaScripts</a></li>
    <
    li><a href="http://www.javascriptkit.com/javatutors/">JavaScript tutorials</a></li>
    <
    li><a href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a></li>
    <
    li><a href="http://www.javascriptkit.com/domref/">DOM Reference</a></li>
    <
    li><a href="http://www.javascriptkit.com/dhtmltutors/">DHTML CSS</a></li>
    </
    ul>

    <
    h3 class="menuheader" style="cursor: default">FeedBack</h3>
    <
    div>
    Regular contents hereHeader does not expand or contact.
    </
    div>

    </
    div>

    <
    p>Assuming the current page is named "current.htm"the below links when navigated to expands a particular header on that page:</p>
    <
    p>
    - <
    a href="current.htm?expandable=0">Expand 1st header within "expandable" header group</a><br />
    - <
    a href="current.htm?expandable=1&subexpandable=0">Expand 2nd header within "expandable" header group and 1st header within nested "subexpandable" group</a><br />
    </
    p>

    <
    p>Helpful links: </p>
    <
    p>
    - <
    a href="http://www.dynamicdrive.com/dynamicindex17/ddaccordion_suppliment.htm">Adding arbitrary links hat expandcollapse the contents</a><br />
    - <
    a href="http://www.dynamicdrive.com/dynamicindex17/ddaccordion_suppliment2.htm">Taking advantage of the oninit() and onopenclose() event handlers</a><br />
    </
    p
    And call that file (accordion.php) into the pages you want them to be placed:
    PHP Code:
    <?php include('accordion.php'); ?>
    Hope that makes sense.
    Learn how to javascript at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph

  • #3
    New to the CF scene
    Join Date
    May 2009
    Location
    usa
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Importing Menu contents via external javascript file?

    I was wondering if there is any possibility at all of possibly placing the menu contents of this:
    http://www.dynamicdrive.com/dynamici...enu-bullet.htm

    Into an external javascript or file rather than having it in the HTML source code?

    I am trying to utilise a menu for a large training site (300+ pages) and finding a navigation is difficult. I've had a look at a few Javascript tree menus, but visually they aren't suitable. I don't particularly want to insert the same menu into 300+ pages, the code starts getting messy with large amounts of content and if I have to make a change then it's a pain in the ***.

    On top of that I'm limited to working within a Interwoven Teamsite template (a bit like having to enter in code straight into this editor without access to the overarching CSS files, page source code etc.)

    I can upload and run external javascripts though.
    shae marks


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •