Shrinking tabs on Window resize

2 posts, 0 answers
  1. Aarsh
    Aarsh avatar
    192 posts
    Member since:
    Jun 2012

    Posted 15 Jun 2012 Link to this post

    Friends,
    Tabs are working just fine in my project but on resizing the window I'd like to re-size the tabs to make sure that they do not get messed with the other controls, any clues ?

    Thanks,
    -Aarsh

    Alternatively...


    I was trying to have a javascript just like the below one, so that as soon as the mouse hovers the Rad-menu, the Z-index becomes 100 and -1 once Mouse gets out.

    I am using the following java-script for the same ...

    //<![CDATA[
     
        function RadMenu1_MouseOver(sender,args)
        {
            //Add JavaScript handler code here
            var id = sender.get_id();
            var menu = $(".RadMenu(id$='" + id + "']");
            menu.css('z-index', 100);
        }
    //]]>
    </script>
        <script type="text/javascript" id="telerikClientEvents2">
    //<![CDATA[
     
        function RadMenu1_MouseOut(sender,args)
        {
            //Add JavaScript handler code here
            //Add JavaScript handler code here
            var id = sender.get_id();
            var menu = $(".RadMenu(id$='" + id + "']");
            menu.css('z-index', -1);
        }
    //]]>
  2. Aarsh
    Aarsh avatar
    192 posts
    Member since:
    Jun 2012

    Posted 15 Jun 2012 Link to this post

    Okay guys, I got it and so sharing it with you, [ I know how does it feels when the search engine sends us to the page where just the question exist, and 0 replies :-) ]

    One of many possible ways to accomplish this is to manage the z-index using the javascript / jQuery. The code below explains how I managed to do it.

    Right Click control --> Properties [ yes, it is not in the events tab. ] --> Click the drop-down list and select "Add a enw method...".



    a dialog box would appear. Name the method appropriately [I used just the default name] and hit Okay.
    And here is the javascript ...

    //<![CDATA[
     
        function RadMenu1_MouseOver(sender,args)
        {
            document.getElementById(sender.get_id()).style.zIndex = 100;
        }
    //]]>
    </script>
        <script type="text/javascript" id="telerikClientEvents2">
    //<![CDATA[
     
        function RadMenu1_MouseOut(sender,args)
        {
            document.getElementById(sender.get_id()).style.zIndex = -1;
        }
    //]]>

    Thanks !
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top