Jump to:

23007 Posts in 11866 Topics by 2828 members

General Questions

SilverStripe Forums » General Questions » Javascript menu

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1 2
Go to End
Author Topic: 2788 Views
  • Briohny
    Avatar
    Community Member
    199 Posts

    Javascript menu Link to this post

    My client insists on having this vertical javascript menu on his site. I know it’s better to use plain CSS but he is very insistent on this menu: http://www.dynamicdrive.com/dynamicindex1/ddlevelsmenu/

    I can get it working as a plain html page but can’t convert into SS format as I can’t get the second or third level to slide out.

    This is my menu code in my page.ss (see attachment: pagess_code.txt)

    I’ve called the following scripts from my header:

    <link rel="stylesheet" type="text/css" href="mysite/ddlevelsfiles/ddlevelsmenu-base.css" />
    <link rel="stylesheet" type="text/css" href="mysite/ddlevelsfiles/ddlevelsmenu-sidebar.css" />
    <script type="text/javascript" src="mysite/ddlevelsfiles/ddlevelsmenu.js">
    ddlevelsmenu.setup("ddsidemenubar", "sidebar") //ddlevelsmenu.setup("mainmenuid", "topbar|sidebar")
    </script>

    All javascript and css files have been downloaded into the ddlevelsfiles/ folder.

    Any advice would help me immensely. Thanks again.

    Attached Files
  • Briohny
    Avatar
    Community Member
    199 Posts

    Re: Javascript menu Link to this post

    Bump bump

  • UncleCheese
    Avatar
    4085 Posts

    Re: Javascript menu Link to this post

    Is this a markup issue or a javascript issue? If you're feeding the JS script everything it wants, then I think you need to troubleshoot your menu script. If you're not getting the right markup, output what you're getting and we may be able to help on the SS side.

    On another topic...

    Just because your client wants that functionality doesn't mean you're stuck with a crumby javascript artifact from 2002. Look at Superfish. It's standards-compliant, same visual effects that your client wants, but just nicer looking and more up-to-date. Even does all the IE hacking for you. That menu just looks.... yikes.

  • ianpiper
    Avatar
    Community Member
    32 Posts

    Re: Javascript menu Link to this post

    I just read this thread and wanted to ask a supplementary question. I am trying to introduce a JavaScript-based feature for doing rounded-corners on content blocks (based on this method: http://www.456bereastreet.com/archive/200609/transparent_custom_corners_and_borders_version_2/).

    My question is, when I need to bring in a third-party JavaScript, where is the best place to put it, and what is the best way to call it? I can see a whole lot of JavaScript files in the jsparty folder, but is this a good place? There is also a javascript folder under mysite, which seems like the proper place. It is not clear though how you actually call the script. Obviously I can hard-code the <script> element into the head of my page.ss file, but is there a more elegant way (e.g., is there a variable similar to $Metadata that I can call)?

    I suppose I can hack my way through this: I'm really looking for advice on best practice.

    Thanks,

    Ian.
    --

  • Briohny
    Avatar
    Community Member
    199 Posts

    Re: Javascript menu Link to this post

    Thanks UncleCheese. I don't think it's a problem with the script or the SS. I think i just don't know exactly how to write the menu code. The 1st level menu is appearing how it should be however i can't get the second level menu to slide out. So it's reading the CSS but not the javascript.

    I found this link to a Superfish menu: http://users.tpg.com.au/j_birch/plugins/superfish/#examples (verticle example)

    If i place this code in the head of my page.ss, what <control> menu code do i need to use within the page to get the menu working?

    Thanks so much for your help.

  • UncleCheese
    Avatar
    4085 Posts

    Re: Javascript menu Link to this post

    First of all, I think this will be helpful to both of you. The proper way to include third party javascript is to place it in your mysite/javascript folder and call it in with the controller. Not on the template.

    class MyPage_Controller extends Page_Controller
    {
    function init()
    {
    parent::init();
    Requirements::javascript('mysite/javascript/myjavascript.js');
    Requirements::css('mysite/css/somecss.css');
    }
    }

    So for you, Briohny, you need to use the above method to pull in jquery.js, superfish.js, superfish.css, and superfish-vertical.css.

    For the markup, you can do

    <% control Menu(1) %>
    <% control Children %>
    <% control Children %>
    <% end_control %>
    <% end_control %>
    <% end_control %>

    something like that ought to work.

  • ianpiper
    Avatar
    Community Member
    32 Posts

    Re: Javascript menu Link to this post

    Thanks for that. I looked in the Page_Controller code (mysite/code/Page.php), but I see a message there (this is v2.3):

          // Note: you should use <% require %> tags inside your templates instead of putting Requirements calls here. However
          // these are included so that our older themes still work

    I can't find a reference describing how to use <% require %> tags: can you point me to any docs on this?

    Ian.

  • UncleCheese
    Avatar
    4085 Posts

    Re: Javascript menu Link to this post

    Ha... I can't either. That's why I recommended doing it the old way. I'm not sure what's going on with those <% require %> tags. Never used 'em, never seen them used.

    2788 Views
Page: 1 2
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.