Hello. I’m having problems with how my pages are flowing with one another. So when u see my site, there is a header on the top, images below it (the image starts at the edge of the left side and ends at the edge of the right side ), and my navigation buttons as individual long bars at the bottom (so my first button is called “looks”. it is the same length horizontally as the images above it, so they have the same y axes. then after this “looks” button bar is a button bar called “likes” then one called “events” and finally one called “contact”. When u click on any of these bar buttons, that page will rise up and show itself. Ex: when “looks” is clicked, it rise up to show the looks page. I put a mask for my looks, likes, events, and contact pages. When each button is clicked in the order that is seen, it flows smoothly to each page, pushing up the previous bar. MY PROBLEM IS, when the bars are clicked randomly and not in the order that you see them, is doesn’t go smoothly anymore. It’s as if they’re jumping with a glitch.
i put images to give a better understanding.
-first image is home page
-Second is “looks” button being clicked
-Third image is the processing of looks page being shown
-The fourth page is finally being at the looks page.
I’m hoping I’ve explained my problem well.
Thank you for all the help
This is my code
import com.greensock.;
import com.greensock.easing.;
looksPanel.looksBtn.addEventListener(MouseEvent.CLICK,showLooks);
likesPanel.likesBtn.addEventListener(MouseEvent.CLICK,showLikes);
eventsPanel.eventsBtn.addEventListener(MouseEvent.CLICK,showEvents);
contactPanel.contactBtn.addEventListener(MouseEvent.CLICK,showContact);
function showLooks(e:MouseEvent):void
{
if(looksPanel.y != 143)
{
TweenLite.to(looksPanel, 1, {y:143});
looksPanel.gotoAndPlay(“SHOW_CONTENT”);
contactPanel.gotoAndPlay(“HIDE_CONTENT”);
likesPanel.gotoAndStop(“COLLAPSED”);
eventsPanel.gotoAndStop(“COLLAPSED”);
contactPanel.gotoAndPlay(“COLLAPSED”);
homePanel.gotoAndPlay(“HIDE_CONTENT”);
}
else
{
TweenLite.to(looksPanel, 1, {y:511});
TweenLite.to(likesPanel, 1, {y:571});
TweenLite.to(eventsPanel, 1, {y:632});
TweenLite.to(contactPanel, 1, {y:692});
looksPanel.gotoAndPlay(“HIDE_CONTENT”);
contactPanel.gotoAndPlay(“HIDE_CONTENT”);
likesPanel.gotoAndStop(“COLLAPSED”);
eventsPanel.gotoAndStop(“COLLAPSED”);
contactPanel.gotoAndPlay(“COLLAPSED”);
homePanel.gotoAndPlay(“SHOW_CONTENT”);
}
}
function showLikes(e:MouseEvent):void
{
if(likesPanel.y !=203)
{
TweenLite.to(likesPanel, 1, {y:203});
TweenLite.to(looksPanel, 1, {y:143});
likesPanel.gotoAndPlay(“SHOW_CONTENT”);
contactPanel.gotoAndPlay(“HIDE_CONTENT”);
looksPanel.gotoAndStop(“COLLAPSED”);
eventsPanel.gotoAndStop(“COLLAPSED”);
contactPanel.gotoAndPlay(“COLLAPSED”);
homePanel.gotoAndPlay(“HIDE_CONTENT”);
looksPanel.gotoAndPlay(“HIDE_CONTENT”);
}
else
{
TweenLite.to(looksPanel, 1, {y:511});
TweenLite.to(likesPanel, 1, {y:571});
TweenLite.to(eventsPanel, 1, {y:632});
TweenLite.to(contactPanel, 1, {y:692});
likesPanel.gotoAndPlay("HIDE_CONTENT");
contactPanel.gotoAndPlay("HIDE_CONTENT");
looksPanel.gotoAndStop("COLLAPSED");
eventsPanel.gotoAndStop("COLLAPSED");
contactPanel.gotoAndPlay("COLLAPSED");
homePanel.gotoAndPlay("SHOW_CONTENT");
}
}
function showEvents(e:MouseEvent):void
{
if(eventsPanel.y !=264)
{
TweenLite.to(eventsPanel, 1, {y:264});
TweenLite.to(likesPanel, 1, {y:203});
TweenLite.to(looksPanel, 1, {y:143});
eventsPanel.gotoAndPlay(“SHOW_CONTENT”);
contactPanel.gotoAndPlay(“HIDE_CONTENT”);
looksPanel.gotoAndStop(“COLLAPSED”);
likesPanel.gotoAndStop(“COLLAPSED”);
contactPanel.gotoAndPlay(“COLLAPSED”);
homePanel.gotoAndPlay(“HIDE_CONTENT”);
likesPanel.gotoAndPlay(“HIDE_CONTENT”);
}
else
{
TweenLite.to(looksPanel, 1, {y:511});
TweenLite.to(likesPanel, 1, {y:571});
TweenLite.to(eventsPanel, 1, {y:632});
TweenLite.to(contactPanel, 1, {y:692});
eventsPanel.gotoAndPlay(“HIDE_CONTENT”);
contactPanel.gotoAndPlay(“HIDE_CONTENT”);
looksPanel.gotoAndStop(“COLLAPSED”);
likesPanel.gotoAndStop(“COLLAPSED”);
contactPanel.gotoAndPlay(“COLLAPSED”);
homePanel.gotoAndPlay(“SHOW_CONTENT”);
}
}
function showContact(e:MouseEvent):void
{
if(contactPanel.y !=324)
{
TweenLite.to(contactPanel, 1, {y:324});
TweenLite.to(eventsPanel, 1, {y:264});
TweenLite.to(likesPanel, 1, {y:203});
TweenLite.to(looksPanel, 1, {y:143});
contactPanel.gotoAndPlay(“SHOW_CONTENT”);
eventsPanel.gotoAndPlay(“COLLAPSED”);
looksPanel.gotoAndStop(“COLLAPSED”);
likesPanel.gotoAndStop(“COLLAPSED”);
homePanel.gotoAndPlay(“HIDE_CONTENT”);
eventsPanel.gotoAndPlay(“HIDE_CONTENT”);
}
else
{
TweenLite.to(looksPanel, 1, {y:511});
TweenLite.to(likesPanel, 1, {y:571});
TweenLite.to(eventsPanel, 1, {y:632});
TweenLite.to(contactPanel, 1, {y:692});
contactPanel.gotoAndPlay(“HIDE_CONTENT”);
eventsPanel.gotoAndPlay(“HIDE_CONTENT”);
eventsPanel.gotoAndPlay(“COLLAPSED”);
looksPanel.gotoAndStop(“COLLAPSED”);
likesPanel.gotoAndStop(“COLLAPSED”);
homePanel.gotoAndPlay(“SHOW_CONTENT”);
}
}
