5 Replies Latest reply on Oct 15, 2011 10:40 AM by Ned Murphy

    Why does the content spill over and how do I position this under the menu and title?

    flash_bugged

      I was following this tutorial on how to add a scrolling image gallery to a Flash website.

      (http://www.republicofcode.com/tutorials/flash/xmlimagegallery/index.php)

       

       

      From what I understand from this tutorial, it is just a matter of copying the Actionscript code and pasting it onto the timelines then making modifications on the XML.

      (kindly see a screenshot of timeline layers I made and as to where I put the Actionscript code:

      http://i429.photobucket.com/albums/qq19/tsujzpie/imagegalleryproblem_01.jpg )

       

       

      I pasted the code onto the blank keyframe labeled "Gallery"...

       

       

      But all I get is this weird effect when I click on the button for the gallery...

      (kindly see a screenshot of it here: http://i429.photobucket.com/albums/qq19/tsujzpie/imagegalleryproblem_02.jpg )

       

       

      When you put a blank keyframe on a timeline, any content put in there is supposed to only be contained in that very frame, right? How come then that - whenever the gallery button is clicked on - the content from that section spills out onto the other sections even when I click on other button for the other areas?

       

       

      I just really couldn't think why this is happening - any reason why this is so?

      And how do I position the gallery right under the section header and menu bar?

       

       

      Here is its AS2 code, by the way:

                import mx.transitions.Tween;

                import mx.transitions.easing.*;

       

                var myGalleryXML = new XML();

                myGalleryXML.ignoreWhite = true;

                myGalleryXML.load("gallery.xml");

       

                myGalleryXML.onLoad = function() {

                          _root.gallery_x = myGalleryXML.firstChild.attributes.gallery_x;

                          _root.gallery_y = myGalleryXML.firstChild.attributes.gallery_y;

                          _root.gallery_width = myGalleryXML.firstChild.attributes.gallery_width;

                          _root.gallery_height = myGalleryXML.firstChild.attributes.gallery_height;

       

                          _root.myImages = myGalleryXML.firstChild.childNodes;

                          _root.myImagesTotal = myImages.length;

       

                          _root.thumb_height = myGalleryXML.firstChild.attributes.thumb_height;

                          _root.thumb_width = myGalleryXML.firstChild.attributes.thumb_width;

       

                          _root.full_x = myGalleryXML.firstChild.attributes.full_x;

                          _root.full_y = myGalleryXML.firstChild.attributes.full_y;

       

                          callThumbs();

                          createMask();

                          scrolling();

       

                };

       

                function callThumbs() {

                          _root.createEmptyMovieClip("container_mc",_root.getNextHighestDepth());

                          container_mc._x = _root.gallery_x;

                          container_mc._y = _root.gallery_y;

       

                          var clipLoader = new MovieClipLoader();

                          var preloader = new Object();

                          clipLoader.addListener(preloader);

       

                          for (i=0; i<myImagesTotal; i++) {

                                    thumbURL = myImages[i].attributes.thumb_url;

                                    myThumb_mc = container_mc.createEmptyMovieClip(i,           container_mc.getNextHighestDepth());

                                    myThumb_mc._y = _root.thumb_height*i;

                                    clipLoader.loadClip("thumbs/"+thumbURL,myThumb_mc);

       

                                    preloader.onLoadStart = function(target) {

                                              target.createTextField("my_txt",target.getNextHighestDepth          (),0,0,100,20);

                                              target.my_txt.selectable = false;

                                    };

       

       

                                    preloader.onLoadProgress = function(target, loadedBytes, totalBytes) {

                                              target.my_txt.text = Math.floor((loadedBytes/totalBytes)*100);

                                    };

       

                                    preloader.onLoadComplete = function(target) {

                                              new Tween(target, "_alpha", Strong.easeOut, 0, 100, .5, true);

                                              target.my_txt.removeTextField();

                                              target.onRelease = function() {

                                                        callFullImage(this._name);

                                              };

       

                                              target.onRollOver = function() {

                                                        this._alpha = 50;

                                              };

       

                                              target.onRollOut = function() {

                                                        this._alpha = 100;

                                              };

                                    };

                          }

                }

       

                function callFullImage(myNumber) {

       

       

                          myURL = myImages[myNumber].attributes.full_url;

                          myTitle = myImages[myNumber].attributes.title;

                          _root.createEmptyMovieClip("fullImage_mc",_root.getNextHighestDepth());

                          fullImage_mc._x = _root.full_x;

                          fullImage_mc._y = _root.full_y;

       

                          var fullClipLoader = new MovieClipLoader();

                          var fullPreloader = new Object();

                          fullClipLoader.addListener(fullPreloader);

       

                          fullPreloader.onLoadStart = function(target) {

                                    target.createTextField("my_txt",fullImage_mc.getNextHighestDepth          (),0,0,200,20);

                                    target.my_txt.selectable = false;

                          };

       

                          fullPreloader.onLoadProgress = function(target, loadedBytes, totalBytes) {

                                    target.my_txt.text = Math.floor((loadedBytes/totalBytes)*100);

                          };

       

                          fullPreloader.onLoadComplete = function(target) {

                                    new Tween(target, "_alpha", Strong.easeOut, 0, 100, .5, true);

                                    target.my_txt.text = myTitle;

                          };

       

                          fullClipLoader.loadClip("full_images/"+myURL,fullImage_mc);

                }

       

                function createMask() {

       

                          _root.createEmptyMovieClip("mask_mc",_root.getNextHighestDepth());

       

                          mask_mc._x = _root.gallery_x;

                          mask_mc._y = _root.gallery_y;

       

                          mask_mc.beginFill(0x000000,100);

                          mask_mc.lineTo(_root.gallery_width,0);

                          mask_mc.lineTo(_root.gallery_width,_root.gallery_height);

                          mask_mc.lineTo(0,_root.gallery_height);

                          mask_mc.lineTo(0,0);

       

                          container_mc.setMask(mask_mc);

       

                }

       

                function scrolling() {

                          _root.onEnterFrame = function() {

       

                                    container_mc._y += Math.cos(((mask_mc._ymouse)/mask_mc._height)          *Math.PI)*15;

       

                                    if (container_mc._y>mask_mc._y) {

                                              container_mc._y = mask_mc._y;

                                    }

       

                                    if (container_mc._y<(mask_mc._y-(container_mc._height-mask_mc.          _height))) {

                                              container_mc._y = mask_mc._y-(container_mc._height-          mask_mc._height);

                                    }

       

                          };

                }