Welcome to Axure Community Site Sign in | Join | Help
in Search

Controlling Z-axis in dynamic panels

Last post 10-05-2008, 4:06 AM by hu_zhenghui. 4 replies.
Sort Posts: Previous Next
  •  09-25-2008, 1:13 PM 3394

    Controlling Z-axis in dynamic panels

    I am mocking up a flash application where we have a grid of buttons. As the user selects a button, it expands to allow text entry and covers up appx. 90% of the other buttons in the grid. I've got the animation to look good, and I'd like to demo two buttons to the client, but right now, I can only have one of the dynamic panels on top.

    Is there a way to change the Z-order of the panels via the cases, so that when one is clicked, that panel is the top layer and will "float" above the other buttons?

    Thanks!

  •  09-25-2008, 2:57 PM 3397 in reply to 3394

    Re: Controlling Z-axis in dynamic panels

    Unfortunately, there isn't a way to bring a dynamic panel to the front dynamically right now. A "bring to front" interaction is expected to be added in an update early next year.
  •  10-03-2008, 6:03 AM 3442 in reply to 3394

    Re: Controlling Z-axis in dynamic panels

    rem:

    I am mocking up a flash application where we have a grid of buttons. As the user selects a button, it expands to allow text entry and covers up appx. 90% of the other buttons in the grid. I've got the animation to look good, and I'd like to demo two buttons to the client, but right now, I can only have one of the dynamic panels on top.

    Is there a way to change the Z-order of the panels via the cases, so that when one is clicked, that panel is the top layer and will "float" above the other buttons?

    Thanks!

    The "Bring to Front" interaction have not been implemented in Axure RP Pro 5, but the similar effect can be implemented by jQuery, See code below:
    var customization_found = true;
    $(function () {
            var currentPageName;
            window.setInterval(function () {
                    if (currentPageName !== mainFrame.PageName) {
                            switch (mainFrame.PageName) {
                                    case 'Home':
                                            $(mainFrame.document).find('[@title="theButton"]').click(function () {
                                                    $(mainFrame.document).find('[@title="theImage"]').prev().css('z-index', '1');
                                            });
                                            break;
                            }
                            currentPageName = mainFrame.PageName;
                    }
            }, 100);
    });



    Skype : huzhenghui
    Gtalk : huzhengh
    Gmail : huzhengh@gmail.com
  •  10-03-2008, 8:18 AM 3443 in reply to 3442

    Re: Controlling Z-axis in dynamic panels

    This doesn't really make things clear huzhenghui...
    At least not for me...

    • Where do I put this code?
    • What do I have to edit?
    • How do I call this script?
    • Does it get overwritten when I generate the prototype?

    Please put a little explanation with your code.

    Thanks in advanced,

    Koen

  •  10-05-2008, 4:06 AM 3447 in reply to 3443

    Re: Controlling Z-axis in dynamic panels

    Koen:

    This doesn't really make things clear huzhenghui...
    At least not for me...

    • Where do I put this code?
    • What do I have to edit?
    • How do I call this script?
    • Does it get overwritten when I generate the prototype?

    Please put a little explanation with your code.

    Thanks in advanced,

    Koen

    Please have a look at http://axure.com/cs/forums/thread/3331.aspx


    Skype : huzhenghui
    Gtalk : huzhengh
    Gmail : huzhengh@gmail.com
View as RSS news feed in XML