13 Replies Latest reply on Jun 29, 2013 9:03 AM by Zaxist

    Edge - Codes Conflicting...?

    RavenDesign Level 1

      Ok So I have tested My codes Both separately in edge they both work perfectly fine,

      However when the 2 sets of codes are combined into a stage one stops working.

      Code 1: (code 1 resides in composistionReady):

      $("#Stage").css({

           "background-image": "url(Raven.jpg)",

           "background-attachment": "fixed",

           "background-size": "cover"

       

      });

       

       

      $("body").append($("#Stage_Nav").width('100%').height('46px').css("position", "fixed"));

       

      Works.

       

      Code 2:(Code 2 resisdes in a button action, a click):

      $('html, body').animate({scrollTop:800}, 'slow');

       

      Now code 2 stop's working but works if code 1 is removed . . . Im not sure why..

      Code 2 is in the actions of a button click.. it basiclly scrolls the page automatically to 800px when the button is clicked.

       

       

       

      Iv also tried:

      $('html,body').animate({

             scrollTop: $(window).scrollTop() + 800

         })

      that failed to work also but works when code 1 is removed..

       

       

      Any Idea's on how to fix this?

      Thanks In Advance! 

        • 1. Re: Edge - Codes Conflicting...?
          RavenDesign Level 1

          Anyone?? edit code 1 where is says window I tired '#Stage' instead that still didn't work ^.^

          • 2. Re: Edge - Codes Conflicting...?
            heathrowe Most Valuable Participant

            Is this exact codes?

             

            1. You need to fix the spacing in the property position

                ... '46px').css("pos ition", "fixed"));

             

            should be

                ...'46px').css("position", "fixed"));

             

            2. Your animate method is missing a trailing semicolon

                  scrollTop: $(window).scrollTop() + 800

             

            should be

                  scrollTop: $(window).scrollTop() + 800;

             

            Darrell

            • 3. Re: Edge - Codes Conflicting...?
              RavenDesign Level 1

              My mistake i was typing it out in here and yes the code doesn't have a space in "position"

              also adding ; did nothing code is still broken...

              Here what I'v found...

              Both codes work when in speperate projects but when you add both codes into the same project the 2nd code stops working . . . its like the 1st code is some how effecting the 2nd code. . that's how it seems to me...

              • 4. Re: Edge - Codes Conflicting...?
                RavenDesign Level 1

                Basically there is nothing wrong with the codes they work, but when put inside the same project code 1 works but code 2 doesnt so in My opinion code 1 is some how stopping code 2 from working properly...

                • 5. Re: Edge - Codes Conflicting...?
                  RavenDesign Level 1

                  Any one please help, I have a deadline for my school project, if the codes look ok to everyone does this mean its a edge bug or something ?

                   

                   

                  Edit: Also tried these and they Work when the 1st code is removed but don't work when the 1st code is in the project:

                   

                   

                   

                   

                  1) $('html,body').animate({

                         scrollTop: $(window).scrollTop() + ('800')

                     })

                   

                   

                   

                   

                  2) $('html').animate({

                         scrollTop: $(window).scrollTop() + ('800px')

                     })

                   

                   

                   

                   

                  3) $('html:not(:animated),body:not(:animated)').animate({scrollTop: 800 },'slow');

                  • 6. Re: Edge - Codes Conflicting...?
                    Zaxist Level 4

                    try replace your line

                     

                    $("body").append($("#Stage_Nav").width('100%').height('46px').css("pos ition", "fixed"));

                     

                     

                    with this

                     

                    sym.$("Stage_Nav").css({"width":"100%",

                                                          "height":"46px",

                                                          "position":"fixed"

                                                       })

                     

                    $("body").appendTo(sym.$("Stage_Nav"));

                     

                     

                    and Let me know

                     

                    Zaxist

                    • 7. Re: Edge - Codes Conflicting...?
                      RavenDesign Level 1

                      Nope

                      sym.$("Stage_Nav").css({"width":"100%",

                                                            "height":"46px",

                                                            "position":"fixed"

                                                         })

                       

                      $("body").appendTo(sym.$("Stage_Nav"));

                       

                       

                      isn't working the Nav no longer fixes to the top and instead scrolls with the other content :/

                      Might it have something to do with the body in both codes?

                      I really don't understandwhy it isn't working both codes work 100% when in different projects but when the 2 codes are in the same project the 2nd code stops working...

                      And thank you for the reply !

                      • 8. Re: Edge - Codes Conflicting...?
                        Zaxist Level 4

                        can you just send me your Project, i can help you better then

                         

                        Zaxist

                        • 9. Re: Edge - Codes Conflicting...?
                          RavenDesign Level 1

                          The .an file or html file? and thank you for helping me

                          • 10. Re: Edge - Codes Conflicting...?
                            heathrowe Most Valuable Participant

                            I don't think, appendTo() is the correct method here, though they look similar, there is a hugh difference in how it is the applied (matched element)

                             

                            the above says "Take all matched elements (body) and put it inside stage_nav"

                            See reference - http://api.jquery.com/appendTo/

                             

                            Should it be append()

                             

                            this says, take the matched element stage_nav and append it to the body.

                            $("body").append(sym.$("Stage_Nav"));

                            http://api.jquery.com/append/

                             

                            D

                            1 person found this helpful
                            • 11. Re: Edge - Codes Conflicting...?
                              Zaxist Level 4

                              you're welcome

                               

                              just Zip up your project folder ( with all files inside ) and upload it to mediafire ( no need to have account if you have facebook or twitter account ) and paste the link here

                               

                              Zaxist

                              • 12. Re: Edge - Codes Conflicting...?
                                RavenDesign Level 1

                                Ok Iv uploaded the ZIP to one of my servers I will PM you the Link

                                • 13. Re: Edge - Codes Conflicting...?
                                  Zaxist Level 4

                                  ok i find out now that you have Edge Animate Version 1.0, So i can't send you back your fixed project, so i describe your problem here and write step by step how you can fix it

                                   

                                   

                                  Why do you had this problem ?

                                   

                                  your problem was your Nav file, it was a picture and after you pin it to browser with this code :

                                   

                                  $("body").append($("#Stage_Nav").width('100%').height('46px').css("pos ition", "fixed"));

                                   

                                  it becomes to the topest layer so your rectangles would be going under your menu

                                   

                                  if you mark select Pointer Cursor for your Rectangle3Copy2 then you can see at the first at the bottom of the service you mouse will change to hand and you can click and will work so you can undrestand that your Rectangle3Copy2 is under your picture !!

                                   

                                  and if we imagine you fix the z-index problem and make your Rectangle3Copy2 to top but here we have another problem and that is your Rectangle3Copy2 is not fixed so when ever you scroll to the bottom you cant see it because it is not pinned to your body so for fixing this all together we have 2 Options

                                   

                                  First : Convert all elements we need to Symbol

                                   

                                   

                                  1 -  Hit Ctrl key from your keyboard and select these elements form your element panel with mouse

                                   

                                  Nav

                                  Rectangle3

                                  Rectangle3Copy2

                                  Rectangle3Copy3

                                  Rectangle3Copy4

                                  Rectangle3Copy5

                                  Rectangle3Copy6

                                   

                                  2 - Now do right click on one of the elements that you are selected

                                   

                                  3 - in the menu opened click on Convert to Symbol...

                                   

                                  4 - enter Nav for your Symbol name and click ok

                                   

                                  Now your top menu work as expect

                                   

                                   

                                  Second : Group all elements we need

                                   

                                  1 - Hit Ctrl key from your keyboard and select these elements form your element panel with mouse

                                   

                                  Nav

                                  Rectangle3

                                  Rectangle3Copy2

                                  Rectangle3Copy3

                                  Rectangle3Copy4

                                  Rectangle3Copy5

                                  Rectangle3Copy6

                                   

                                  2 - Now do right click on one of the elements that you are selected

                                   

                                  3 - in the menu opened click on Group elements in DIV

                                   

                                  4 - rename your Group to Navi ( or what ever you like ) and also change this line in yourStage > CompositionReady

                                   

                                  $("body").append($("#Stage_Navi").width('100%').height('46px').css("position", "fixed"));

                                   

                                   

                                  in the end your Project is beautiful

                                   

                                  Zaxist