Thumbnail To FullSize Image Effect
Hello Flashers!
I want to have four images below each other on the left of the stage, these would be small thumbnails and might will include bmp's and also swf's with 3d in them.
I'd like to ActionScript a function so someone can click on the thumbnail and it opens the image to the right of the list. The effect i'd like it to have the image zoom out, into the space, from the thumbnail.
I haven't started yet - does anyone have any tips??
Thanks for your help.
SFilter
FlashKit > Flash Help > Flash MX
Posted on: 12-01-2002, 11:17 AM
View Complete Forum Thread with Replies
Sponsored Links:
Actionscript Image Gallery > Updating Thumbnail And Main Image
Hi all,
I'm helping a friend produce a small Flash website. For some artwork/photos.
Basically a strip of thumbnail images at the bottom, clicking a thumbnail will load the (fullsize) image above.
Currently ten thumbnails scroll across.
**The problem**
.. is he wants to be able to drop a thumbnail image and the corresponding fullsize image into a folder on the server. The Movie should then display the latest additions. I can produce a simple slideshow where extra images are loaded at run-time (MX introduced this). But am trying to figure out how to update both the thumbnail strip and the main image.
Any help/pointers greatly appreciated.
Robert
View Replies !
View Related
Fullsize Flash & Lightbox
Hi Everyone,
I am trying to get lightbox to work on my fullsize flash site but I am having some difficulties.
The code I recieved from here:
http://blog.codefidelity.com/?p=16
works but it doesnt overlay the screen. It hides the flash behind a black box with no transparency and pushes the pop up image way down the screen. YOu have to scroll way down to see anything. Everything is all messed up.
Anyone know where I can find a good code for using lightbox on a fullsize flash site? Any ideas on how to fix this?
THX
View Replies !
View Related
Fullsize Issues With FLV Player
Hi all,
Quality forum by the way. I am newish to flash and am currently working on building an FLV player. It is all working but have hit a major stumbling block whilst trying to use the full screen mode. I want the screen to go full size and have my controls sit at the bottom of the page and my video to scale to its true 100% form.
I have forced true myVideo.autoSize to true this makes the video perfect size but controls dont move (and why should they). If anyone has any words of wisdom on this issue it would be great I am having headache after headache. I do have an event on a button that fires the toggleFullScreen function
My code thus far is
Code:
var vidSrc:String = _level0.vidSrc;
myVideo.contentPath = "../flv/1.flv"
myVideo.playButton= Play_btn;
myVideo.pauseButton= freeze_btn;
myVideo.volumeBar = cVolumeBar;
myVideo.seekBar = mySeekBar;
myVideo.stopButton = myStopButton;
Stage.scaleMode="noScale";
Stage.align = "BC";
//Function to toggle between fullscreen and normal size
//the toggle fullscreen button calls this function when pressed
function toggleFullScreen()
{
if(Stage["displayState"]=="normal"){
Stage["displayState"]="fullScreen";
myVideo.autoSize = false;
trace (Stage.height + " - " + Stage.width)
}else{
Stage["displayState"]="normal";
myVideo.autoSize = false
}
}
var resizeListener:Object = new Object();
resizeListener.onResize = function () {
viewFull._x=Stage.width/2;
viewFull._y=Stage.height/2;
}
Stage.addListener(resizeListener);
View Replies !
View Related
Linking Dyn Thumbnails To Fullsize Jpgs
Hey there-
I am fairly new to MX 2004, (previously used Adobe LM) but am well under way building a dynamic gallery using PHP and mySQL. So far I am able to load the thumbnails from my database, and create an onPress event for each thumbnail. I can get a static .jpg to load, but I can't get the thumbnial to link with the corresponding fullsize image dynamically.
Basically I have loaded the filenames from the database into two arrays: thumbnails[] and fullsize[]. I know the database is working perfectly, I can load the fullsize images or the thumbnails into the thumbnail placeholders. I'm at work so I can't post the .fla until later, but I can paste the AS into a message if anyone is willing to help.
BTW I know nothing about XML...
Any help is greatly appreciated!!
--JD
View Replies !
View Related
How To Use Fullsize Pics As Thumbnails [renamed]
He guys. Sorry for being so dramatic, but i'm itching to know this now! I created the flash gallery, like in the tutorial, but I have 1 issue with the whole thing. I need a way to generate thumbnails from the same image files as my large images, (image1.jpg is both the large image and the small image) and also allow me to adjust thumbnail size through either flash or xml scripting. It seems rather work-heavy to make a seperate list of thumbnails, even though the page would load faster. If anyone can help me with this, I would really appreciate it. (please explain it to me like I don't know what i'm doing... cuz i dont lol)
View Replies !
View Related
Linking Dyn Thumbnails To Fullsize Jpgs
Hey there-
I am fairly new to MX 2004, (previously used Adobe LM) but am well under way building a dynamic gallery using PHP and mySQL. So far I am able to load the thumbnails from my database, and create an onPress event for each thumbnail. I can get a static .jpg to load, but I can't get the thumbnial to link with the corresponding fullsize image dynamically.
Basically I have loaded the filenames from the database into two arrays: thumbnails[] and fullsize[]. I know the database is working perfectly, I can load the fullsize images or the thumbnails into the thumbnail placeholders. I'm at work so I can't post the .fla until later, but I can paste the AS into a message if anyone is willing to help.
BTW I know nothing about XML...
Any help is greatly appreciated!!
--JD
View Replies !
View Related
Thumbnail Effect
check out the thumbnails...any ideas how to to achieve the preloader(the white square) effect? i i'm sure there is a thread on this topic somewhere. ..
thanks guys =|
http://www.crescentcourt.com/gallery.cfm
View Replies !
View Related
Thumbnail Effect
Hello,
this is alitle hard to explain (im really bad at explaining) but I hope you get the picture.
What I want to do, is have a lot of thumbnails, each with different picture and tooltip on them (so, if it is on my portfolio, each will me a website I have done, and the tool tip will say the company name).
Anyway, What I want, is for when you roll over one of them, it expands, and then pushes all of the other thumbnails (because, if they are all the same distance around it, when it expands, all the other ones have to move away to give it room, get what I mean?)
Ive seen it doen before, I just cant find an example,
Anyway, I hope you understood me
Thanks in advanced,
Giles
View Replies !
View Related
Thumbnail Effect
ok, ever seen the sites that when you click on a picture, everything else fades to a transparent black? I tried achieveing the effect but I ran into a problem.
I have three buttons and a black box with about 85% opacity (visible = false) on layer 1. What i click on a button, that button becomes a higher index than the others. Then, the black box gets set to visible and covers the stage EXCEPT the button I clicked. Then, a back button appears.
Here is my problem, when i go back and click a different button, the first one i clicked is still higher in the index so both boxes stick through... Is there a way I can set the button that is showing back to an index of -1?
Its hard to explain so i attached the swf and the code:
Code:
import flash.display.SimpleButton;
graybox.visible = false;
back_btn.visible = false;
btn1.addEventListener(MouseEvent.CLICK, doit);
btn2.addEventListener(MouseEvent.CLICK, doit);
btn3.addEventListener(MouseEvent.CLICK, doit);
back_btn.addEventListener(MouseEvent.CLICK, go);
function doit(e:MouseEvent):void {
graybox.visible =true;
setChildIndex(DisplayObject(e.target),numChildren - 1);
back_btn.visible = true;
}
function go(e:MouseEvent):void {
graybox.visible = false;
back_btn.visible = false;
}
View Replies !
View Related
Help With This Thumbnail Scrolling Effect?
Hi!
I've attached a file that lays out in simple fashion what I want to do: create a vertical scroller that scrolls through a list of 5+ buttons. The effect would be very similar to FlashLoaded's ThumbNailer. But the Thumbnailer doesn't support PNG files, and ultimately that is what I need to use.
Any help would be much appreciated.
Cheers,
JS
View Replies !
View Related
Thumbnail Buttons In Transition Effect Ga;;ery
Hello,
I have used the attached code to apply transition effects to a JPEG This code works great but when I try to install thumbnail buttons using loadclip or loadmovie the JPEG loads with out the effect or doesn't load at all. What can I do to get my thumbnails to load JPEG's with transitions when clicked?
Thanks,
WonderWendy
Attach Code
import mx.transitions.*;
import mx.transitions.easing;
this.createEmptyMovieClip("image_mc", this.getNextHighestDepth());
var mclListener:Object = new Object();
mclListener.onLoadStart = function(target_mc:MovieClip) {
//do something
};
mclListener.onLoadComplete = function(target_mc:MovieClip) {
//do something
};
mclListener.onLoadInit = function(target_mc:MovieClip) {
TransitionManager.start(target_mc,
{type:Blinds, direction:Transition.IN,
duration:2, easing:None.easeNone,
numStrips:10, dimension:0});
};
var image_mcl:MovieClipLoader = new MovieClipLoader();
image_mcl.addListener(mclListener);
image_mcl.loadClip("http://www.helpexamples.com/flash/images/image1.jpg", image_mc);
View Replies !
View Related
Pan Image With Thumbnail
Hi i have a small fla constructed from one of the tutorials on this site.
It is a zoom and pan image fla
in which a large zoomed image is on the right and a small thumbnail is on the left.
What currently hapenns is that on using the small thumbnail u can navigate the larger image.
What i also want to do is to allow the user to drag the large image also, which i am able to do but the smaller image dosent get updated to show the current zoom area.
i have uploaded the fla here..
http://joediassucks.tripod.com/zoom_flash.zip
regards
rahul
View Replies !
View Related
Go To First Thumbnail Image
I have created a thumbnail in my photo gallery and all are working fine. thumbnails are on left side (Up-Down).
when i change category, by default thumbnail do not go to the first image.
Following is the scenario:
"Category1" button have 25 images
"Category2" button have 10 images.
Now i am on 15th image in "Category1" at that point, when i click on "Category2" command button, thumbnail loaded for "Category2" shows last few image of thumbnail. To see the first image of "Category2" i have to scroll up.
Can you please let me know what changes i have to made in this code; so it show the first thumbnail when i change category?
Following is the thumbnail code i am using.
function thumbnails_fn (k)
{
thumbnail_mc.createEmptyMovieClip ("t" + k, thumbnail_mc.getNextHighestDepth ());
tlistener = new Object ();
tlistener.onLoadInit = function (target_mc)
{
target_mc._y = hit_left._y + (eval ("thumbnail_mc.t" + k)._height + 5) * k;
target_mc.pictureValue = k;
target_mc.onRelease = function ()
{
p = this.pictureValue;
// Draw Picture
setPicture (p);
};
target_mc.onRollOver = function ()
{
this._alpha = 50;
thumbNailScroller ();
};
target_mc.onRollOut = function ()
{
this._alpha = 100;
};
};
image_mcl = new MovieClipLoader ();
image_mcl.addListener (tlistener);
image_mcl.loadClip (thumbnails[k], "thumbnail_mc.t" + k);
}
function thumbNailScroller ()
{
this.createEmptyMovieClip ("tscroller", 1000);
scroll_speed = 10;
tscroller.onEnterFrame = function ()
{
if ((_root._xmouse >= thumbnail_mc._x) && (_root._xmouse <= thumbnail_mc._x + thumbnail_mc._width))
{
if ((_root._ymouse >= (hit_right._y - 40)) && (thumbnail_mc.hitTest (hit_right)))
{
thumbnail_mc._y -= scroll_speed;
}
else if ((_root._ymouse <= 100) && (thumbnail_mc.hitTest (hit_left)))
{
thumbnail_mc._y += scroll_speed;
}
}
else
{
delete tscroller.onEnterFrame;
}
};
}
Category1.onRelease = function ()
{
category_fn ("Category1");
};
function category_fn (category)
{
if (_root.levelChild.childNodes[attr].attributes.Menu == category)
{
var loader:MovieClipLoader = new MovieClipLoader ();
var myListener:Object = new Object ();
loader.addListener (myListener);
loader.loadClip (info_xml[0].attributes.thumbnail, thumbnail_mc);
myListener.onLoadInit = function (target_mc)
{
setPicture (0);
for (i = 0; i < itemTotal; i++)
{
thumbnails[i] = info_xml[i].attributes.thumbnail;
thumbnails_fn (i);
}
};
}
}
View Replies !
View Related
Image Thumbnail
Hi every one,
Is there any way or code for changing Image thumbnail of my web site?
Sorry if I posted here.
Please, If I should post some in other places for faster answer let me know.
Happy New Year.
View Replies !
View Related
XML Thumbnail Gallery/ Complex Rollover Button Effect
Hi everybody, this is my first time posting. I've been working on the XML Thumbnail gallery tutorial posted up and I wanted to know if it's possible to make a complex rollover effect on an xml button? For example I would like to make this character { rotated 180 degrees above the button as a person highlights the button. How would I go about that.
Also can i add a shadow background to the button?
Thanks in advance
View Replies !
View Related
Image Thumbnail Slider
I am looking for an image thumbnail slider similar to the gallery page on this link http://www.sharktale.com/main.php?swf=trailer
I have tried looking in the movies section and tried a search but can`t find anything on it. Does anyone know whether something like this is on here, or even what this technique is called so I do a google on it?
Thanks
View Replies !
View Related
Thumbnail Load Image
Hi there!
Im trying to create a thumbnail load image feature,
where the thumnail images are stored within a buttonless scroller
which moves left and right = with the 'mouse over' feature
and when an individual imafe is clicked I want the image to be loaded.
I have found 2 tutorials on Flash Kit, but havent
had any luck implmenting the feature.
I am quite basic with actionscript and the tutorials are quite at an intermediate level so I cant really change the actionscript to what i want without crashing the entire citys network!
This project is for my final year project so i really would appreciate any suggestions or if any1 has any known tutorials of this feature i would be really grateful.
I actually used http://www.elearnage.com/elearn/ this sites tutorials which is exactky what im looking for - but i also have Flash MX 6.0 and the source documents on this site employ Flash 7.0 so have a problem of not being able to view the code to where I went wrong.
Appreciate any suggestions
Regards
Shana
View Replies !
View Related
Help With Image Zoom With Thumbnail
Hi guys,
I have been searching these forums all day but have found nothing!
I am trying to replicate the image zoomer on this website:
http://www.comet.co.uk/cometbrowse/m...17560&zoom=yes
I cannot find any tutorials that are anything like this particular image zoomer. All the tutorials on this site seem to work in different ways to this one.
I have tryed looking at the source to see how this one works but it's proving difficult for me.
Any help appreciated!
View Replies !
View Related
Thumbnail Image Gallery MX
Hey guys, can anyone point me in the direction of a nice, simple tutorial for an image gallery? My needs are simple...
I need:
- Thumbnails at the bottom
- images to fade in/out
- load external images
There is a sample in the MX folder (comes with MX) which would have been ace, but only uses two buttons (a back and a forward) I'm not too clued up on how to change the code to make more buttons etc.
Any help appreciated.
Cheers, Ron
View Replies !
View Related
[CS3] Popup Image From Thumbnail?
i was hoping someone could help me find a tutorial or give me some info on creating a thumbnail viewer.
i would like to be able to place thumbnails in my flash page/movie for things such as updates. when the viewer clicks on the thumbnail it would enlarge over the entire page and you would be able to see a big version of the picture.
i want to have them throughout my site so i don't know if a gallery would work. maybe i could use XML and call it from flash. not sure
any help would be great.
thanks,
mike
View Replies !
View Related
Help With Thumbnail Image Scroller
Hi, everybody,
I will really appreciate your help with this. I have the code for an image scroller and its working fine. A test site is at www.alexojeda.com . But besides the capabilities the scroller now has on "mouse over, out and on release", I'd like the thumbnail scroller to start looping to the left side as soon as the page is loaded, with out loosing the capabilities mentioned above.
THE IMAGE THUMBNAIL CODE MODULE:
// function to move thumbnail slider ("this" = thumbs_mc)
function sliderControl() {
var w:Number = this._width/2;
var hw:Number = mask_mc._width/2;
var npixels:Number;
// only do when mouse over slider mask
if (_ymouse > mask_mc._y && _ymouse < mask_mc._y + mask_mc._height) {
// mouse over left half of slider:
if (_xmouse > mask_mc._x && _xmouse < mask_mc._x + hw) {
npixels = (hw - _xmouse) / hw * MAXPIXELS;
this._x += npixels;
if (this._x >= 0) this._x = this._x - w;
// mouse over right half of slider:
} else if (_xmouse > mask_mc._x + hw && _xmouse < mask_mc._x + mask_mc._width) {
npixels = (_xmouse - hw) / hw * MAXPIXELS;
this._x -= npixels;
if (this._x <= -w) this._x = this._x + w;
Thanks a lot!!!
View Replies !
View Related
Next Set Of Thumbnail And Linking Image
Thank you to those few people that offered help but then sort of fizzled out in the help department. I know life gets busy and such so I'm hoping maybe somone else can chime in.
I'm working with a website template with galleries using Macromedia Flash MX Pro 2004. All I want to do is change text and exchange their stock photos for my own. I know... not very creative but hey... we can't all be technically inclined! I solved my dilema on adding more thumbnails to a gallery (actually the place I bought the template from solved that for me by updating the template). For the first set of thumbnails I was able to put my own photos in place simply through the library. But for the next set of thumbnails..... I don't see "where" the next image is in the library, and am unsure how to link it to the thumbnail. (this is NOT a slideshow)
I'm actually starting to confuse myself..... can anyone help?
-K
View Replies !
View Related
Upload Image, Get Thumbnail
I am trying to upload an image, then load a thumbnail back in. So far I have an uploader that posts to a PHP script, and a PHP script that resizes the image. The php script resizes the image, then stores it as X.jpg, where X is the next free id in the data base.
What I need to know is, how to I get X? Is there a way to get the server's responses, maybe as a property of the event passed to the oncomplete event? Do I have to query an XML file after my upload, and check for a race condition, and code in retries?
View Replies !
View Related
Please Help With Thumbnail Image Scroller
Hi, everybody,
I will really appreciate your help with this. I have the code for an image scroller and its working fine. A test site is at www.alexojeda.com . But I will also like to have the scroller looping to the left side as soon as the page is loaded, without loosing any of the scroller capabilities now working with the code below:
THIS IS THE SCROLLERS CODE MODULE:
// function to move thumbnail slider ("this" = thumbs_mc)
function sliderControl() {
var w:Number = this._width/2;
var hw:Number = mask_mc._width/2;
var npixels:Number;
// only do when mouse over slider mask
if (_ymouse > mask_mc._y && _ymouse < mask_mc._y + mask_mc._height) {
// mouse over left half of slider:
if (_xmouse > mask_mc._x && _xmouse < mask_mc._x + hw) {
npixels = (hw - _xmouse) / hw * MAXPIXELS;
this._x += npixels;
if (this._x >= 0) this._x = this._x - w;
// mouse over right half of slider:
} else if (_xmouse > mask_mc._x + hw && _xmouse < mask_mc._x + mask_mc._width) {
npixels = (_xmouse - hw) / hw * MAXPIXELS;
this._x -= npixels;
if (this._x <= -w) this._x = this._x + w;
Thanks a lot!!!
View Replies !
View Related
Clicking Thumbnail Image In External Txt
Hi everybody,
Currently I am developing a flashsite with externally loaded txt-files. In these .txt-files I included some images by using html. These images show up perfectly in the swf. What I want to do, is make these images clickable. By clicking on that image should load a flashmovie over the current movie and show a bigger version of the image with some text. Closing this overlaying movie brings one back to the original movie where the text and thumbnails are viewed.
How can I achieve this? Is this even possible?
I hope someone can help me with this. It would be great to get this to work.
Thanks in advance.
Kind regards,
Spots
View Replies !
View Related
Thumbnail Image Gallery Swapimage Help.
I'm trying to make a thumbnail image gallery where a mouseover will display a large image of the mouseover in a separate area... also I want that image to remain 'sticky' on a mouseout of the thumbnail, so it can be clicked on to get a url...
I put some code in the third image from the left that I thought would work, ... got the cool horizontal scroller from gotoandlearn.com
Calvin.
(.fla attatched)
View Replies !
View Related
[F8] Image Gallery Thumbnail Conumdrum
Hi,
I am creating a photo-gallery that is XML driven. I have it almost entirely working but have a few snags that I am not sure how to fix.
In my gallery, I have a previous and next button and also thumbnail blocks that the user can click on to take them to any picture in the gallery.
My problem is that I don't know how to keep track of where in the array the user is when they click on the thumbnail and then either the next or the previous button. Now, I can click on the thumbnail of the 4th image and when I hit the next button, it should take me to the 5th but it doesn't, it takes me to the 2nd etc.
I know that I can manually add the information into the XML file as a hard-coded index and every line in the XML file will have a number that increments by one but I am sure that there's a way to do it using actionScript.
Here's the code:
Code:
var galleryXML = new XML();
galleryXML.ignoreWhite = true;
galleryXML.load("gallery.xml");
var currentIndex:Number = 0;
var data:XML;
galleryXML.onLoad = function(success) {
if (success) {
total = galleryXML.firstChild.firstChild.childNodes.length;
var galleryXML:Array = galleryXML.firstChild.firstChild.childNodes;
trace("xmlLoaded");
data = this.firstChild;
total_txt.text = total;
image_holder1_mc.loadMovie("images/"+galleryXML[currentIndex].attributes.filename1);
image_holder2_mc.loadMovie("images/"+galleryXML[currentIndex].attributes.filename2);
caption1 = galleryXML[currentIndex].attributes.caption1;
caption2 = galleryXML[currentIndex].attributes.caption2;
template = galleryXML[currentIndex].attributes.template;
caption1_txt.text = galleryXML[currentIndex].attributes.caption1;
caption2_txt.text = galleryXML[currentIndex].attributes.caption2;
template_txt.text = galleryXML[currentIndex].attributes.template;
_root.caption1_txt._visible = false;
_root.MouseOverFade_mc._visible = false;
template2();
setUpViews();
}
};
listen = new Object();
listen.onKeyDown = function() {
if (Key.getCode() == Key.LEFT) {
prevImage();
} else if (Key.getCode() == Key.RIGHT) {
nextImage();
}
};
function template2() {
if (template_txt.text == 2) {
_root.Template2._visible = false;
} else {
_root.Template2._visible = true;
}
}
Key.addListener(listen);
previous_btn.onRelease = function() {
prevImage();
};
next_btn.onRelease = function() {
nextImage();
};
function nextImage() {
if (currentIndex<(total-1)) {
currentIndex++;
var currentNode = galleryXML.firstChild.firstChild.childNodes[currentIndex];
trace(currentNode);
current_pos = currentIndex+1;
image_holder1_mc.loadMovie("images/"+currentNode.attributes.filename1);
image_holder2_mc.loadMovie("images/"+currentNode.attributes.filename2);
caption1_txt.text = currentNode.attributes.caption1;
caption2_txt.text = currentNode.attributes.caption2;
template_txt.text = currentNode.attributes.template;
next_imageNumber();
template2();
currentIndex_txt.text = current_pos;
}
}
function prevImage() {
if (currentIndex>0) {
currentIndex--;
var currentNode = galleryXML.firstChild.firstChild.childNodes[currentIndex];
trace(currentNode);
image_holder1_mc.loadMovie("images/"+currentNode.attributes.filename1);
image_holder2_mc.loadMovie("images/"+currentNode.attributes.filename2);
caption1_txt.text = currentNode.attributes.caption1;
caption2_txt.text = currentNode.attributes.caption2;
template_txt.text = currentNode.attributes.template;
currentIndex_txt.text = currentIndex+1;
//current_pos = currentIndex+1;
previous_imageNumber();
template2();
}
}
function next_imageNumber() {
current_pos = currentIndex+1;
nextImageOfX.text = current_pos+" / "+total;
}
function previous_imageNumber() {
current_pos = currentIndex+1;
nextImageOfX.text = current_pos+" / "+total;
}
//here's where I create the thumbnail blocks and the links to the images and captions
function setUpViews():Void {
for (var i:Number = 0; i<total; ++i) {
var item = thumbnailHolder.attachMovie("genericThumb", "genericThumb"+total, thumbnailHolder.getNextHighestDepth());
var ref = this;
var currentNode = galleryXML.firstChild.firstChild.childNodes[i];
trace(currentNode);
item.image1 = "images/"+currentNode.attributes.filename1;
item.image2 = "images/"+currentNode.attributes.filename2;
item.template = currentNode.attributes.template;
item.caption1 = currentNode.attributes.caption1;
item.caption2 = currentNode.attributes.caption2;
item.currentThumb = "currentThumb";
item.onRelease = function() {
ref.image_holder1_mc.loadMovie(this.image1);
ref.image_holder2_mc.loadMovie(this.image2);
ref.genericThumb.loadMovie(this.currentThumb);
caption1_txt.text = (this.caption1);
caption2_txt.text = (this.caption2);
template_txt.text = (this.template);
currentIndex_txt.text = currentIndex;
template2();
};
item._x = (item._width+5)*currentIndex;
currentIndex++;
trace("hi im "+item);
}
}
stop();
Also, how do I make the generic grey thumbnail that the user is currently viewing have another appearance so it indicates which one they are viewing? Right now, all the thumbnails are grey and you can't tell which one you are on. I know that it should be located in the following block of code (I have tried ref.genericThumb.loadMovie(this.currentThumb); and it didn't work):
Code:
item.onRelease = function() {
ref.image_holder1_mc.loadMovie(this.image1);
ref.image_holder2_mc.loadMovie(this.image2);
ref.genericThumb.loadMovie(this.currentThumb);
caption1_txt.text = (this.caption1);
caption2_txt.text = (this.caption2);
template_txt.text = (this.template);
currentIndex_txt.text = currentIndex;
template2();
};
Thank you anyone and everyone that can help.....
Brent
View Replies !
View Related
First Thumbnail Image Display Problem.
I have created a thumbnail in my photo gallery and all are working fine. thumbnails are on left side (Up-Down).
when i change category, by default thumbnail do not go to the first image.
Following is the scenario:
"Category1" button have 25 images
"Category2" button have 10 images.
Now i am on 15th image in "Category1" at that point, when i click on "Category2" command button, thumbnail loaded for "Category2" shows last few image of thumbnail. To see the first image of "Category2" i have to scroll up.
Can you please let me know what changes i have to made in this code; so it show the first thumbnail when i change category?
Following is the thumbnail code i am using.
function thumbnails_fn (k)
{
thumbnail_mc.createEmptyMovieClip ("t" + k, thumbnail_mc.getNextHighestDepth ());
tlistener = new Object ();
tlistener.onLoadInit = function (target_mc)
{
target_mc._y = hit_left._y + (eval ("thumbnail_mc.t" + k)._height + 5) * k;
target_mc.pictureValue = k;
target_mc.onRelease = function ()
{
p = this.pictureValue;
// Draw Picture
setPicture (p);
};
target_mc.onRollOver = function ()
{
this._alpha = 50;
thumbNailScroller ();
};
target_mc.onRollOut = function ()
{
this._alpha = 100;
};
};
image_mcl = new MovieClipLoader ();
image_mcl.addListener (tlistener);
image_mcl.loadClip (thumbnails[k], "thumbnail_mc.t" + k);
}
function thumbNailScroller ()
{
this.createEmptyMovieClip ("tscroller", 1000);
scroll_speed = 10;
tscroller.onEnterFrame = function ()
{
if ((_root._xmouse >= thumbnail_mc._x) && (_root._xmouse <= thumbnail_mc._x + thumbnail_mc._width))
{
if ((_root._ymouse >= (hit_right._y - 40)) && (thumbnail_mc.hitTest (hit_right)))
{
thumbnail_mc._y -= scroll_speed;
}
else if ((_root._ymouse <= 100) && (thumbnail_mc.hitTest (hit_left)))
{
thumbnail_mc._y += scroll_speed;
}
}
else
{
delete tscroller.onEnterFrame;
}
};
}
Category1.onRelease = function ()
{
category_fn ("Category1");
};
function category_fn (category)
{
if (_root.levelChild.childNodes[attr].attributes.Menu == category)
{
var loader:MovieClipLoader = new MovieClipLoader ();
var myListener:Object = new Object ();
loader.addListener (myListener);
loader.loadClip (info_xml[0].attributes.thumbnail, thumbnail_mc);
myListener.onLoadInit = function (target_mc)
{
setPicture (0);
for (i = 0; i < itemTotal; i++)
{
thumbnails[i] = info_xml[i].attributes.thumbnail;
thumbnails_fn (i);
}
};
}
}
View Replies !
View Related
Load Thumbnail Image 1 By 1 Using For Loop?
I have seen some people worked out some photogalleries which load the images in thumbnail 1 by 1...
I'm interested to know if I could do it in a "for loop"?
my work here:
http://www.eo.com.hk/album/series_1/
all the thumbnail loaded at the same time.... I use "for loop" to load the thumbnail, is there any way to make it load the image 1 by 1, but still keeping the using "for loop"?
thanks!
View Replies !
View Related
Thumbnail To Larger Image Preview
Hello,
I am trying to create a photo gallery/portfolio. I would like to have thumbnails and when clicked a larger version of that images shows. After that I would like to rollover the larger image to show the before.
Any ideas on how to scrip this?
View Replies !
View Related
Image Gallery Thumbnail Actionscript Help
Hi,
I’m building an image gallery using thumbnails, which each have an up and over state movieclip, to trigger loading the main image. I want the relevant thumbnail to remain highlighted or in the over state whilst the image is viewed and until the next image loads. As this is quite a common technique is there an actionscript available?
This is my first project of this type so please keep in mind.
Thanks
View Replies !
View Related
Load 30 Image, Thumbnail, N Swapdepths
Hello... i'm a flash newbie and learn AS hardly... pls help
i want to load 30 images to 30 empty mc's in same parent. my script is:
Code:
loadmovie ("komers1.jpg", "komers1");
loadmovie ("komers2.jpg", "komers2");
loadmovie ("komers3.jpg", "komers3");
// so on
loadmovie ("komers30.jpg", "komers30");
my question is:
1. how to make the script compact and more simple?
2. is it possible to rezise all imaged loaded to 20% it's original size? how to do that?
3. how to zoom in-out from thumbnail size.
after all image are loaded, i want visitor able click "komers1" mc (.. so on) and when the mc is clicked, it'll zoom to original size (100%) n go to highest level, covering others image. then zoom out back (20%) if visitor click again.
pls help me...
thx in advance
View Replies !
View Related
Image Portfolio - Thumbnail Layout
OK i'm an actionscript NOOB, and I did the tutorial thing on an XML Image portfolio!
http://www.kirupa.com/web/xml/examples/portfolio.htm
and! it works great! but! I want to put in a bunch of pictures - and I'd like them to fit in a box ---- kinda confusing
http://www.arwestudios.com/imageportfolio
-- this is the page i'm working on- notice how the last thumbnail goes off the white box- does anyone know if its possible to get the thumbnails to go down to the next line? -- and if not- if there's an easier way to accomplish the same thing.
--THANKYOU! for the help I love you
- here's my code- just in case your extra crazy
Code:
stop();
image_mc.setMask(mask_mc);
var thumb_spacing = 55;
// load variables object to handle loading of text
var description_lv = new LoadVars();
description_lv.onData = function(raw_text){
description_txt.text = raw_text;
}
function GeneratePortfolio(portfolio_xml){
var portfolioPictures = portfolio_xml.firstChild.childNodes;
for (var i = 0; i < portfolioPictures.length; i++){
var currentPicture = portfolioPictures[i];
var currentThumb_mc = menu_mc.createEmptyMovieClip("thumbnail_mc"+i,i);
currentThumb_mc._x = i * thumb_spacing;
currentThumb_mc.createEmptyMovieClip("thumb_container",0);
currentThumb_mc.thumb_container.loadMovie(currentPicture.attributes.thumb);
currentThumb_mc.title = currentPicture.attributes.title;
currentThumb_mc.image = currentPicture.attributes.image;
currentThumb_mc.description = currentPicture.attributes.description;
currentThumb_mc.onRollOver = currentThumb_mc.onDragOver = function(){
info_txt.text = this.title;
}
currentThumb_mc.onRollOut = currentThumb_mc.onDragOut = function(){
info_txt.text = "";
}
currentThumb_mc.onRelease = function(){
image_mc.loadMovie(this.image);
description_lv.load(this.description);
}
}
}
// xml object for xml content (defines sources for selections)
var portfolio_xml = new XML();
portfolio_xml.ignoreWhite = true;
portfolio_xml.onLoad = function(success){
if (success) GeneratePortfolio(this);
else trace("Error loading XML file"); // no success? trace error (wont be seen on web)
}
// load
portfolio_xml.load("portfolio.xml");
View Replies !
View Related
Thumbnail Scroller With Frame For Each Image
Hi!,
I followed this example:
http://www.kirupa.com/developer/mx2004/thumbnails.htm
But what I want is that each image gets a certain frame, something like this:
Can this be done?
I tried to load in a swf file instead of a image:
image_mcl.loadClip("frame.swf?image=picture1.jpg", "thumbnail_mc.t"+k);
but that doesn't work.
The code in frame.swf to read in the 'image' variable is as follows:
Code:
_root.onLoad();
test = _root.image;
mc.loadClip(test);
Where mc is a movieclip where the picture must be positioned.
I hope someone has an idea
-Roeland
View Replies !
View Related
Xml/thumbnail Image Gallery Problem
i'm using a modified version of the xml thumbnail tutorial on this site and am having a weird problem. sometime on some machines the thumbnails are desplayed in reverse order but when the page is refreshed they're dispalyed in the correct order. on other machines they load in in the correct order fine. anyone have any ideas why this would happen? the image names are loaded into an array
in the onload of the xml the thumb images are put into an array:
for (z=0; z<videototal; z++) {
thumbnails[z] = xmlNode.childNodes[z].childNodes[0].firstChild.nodeValue;
moviefile[z] = xmlNode.childNodes[z].childNodes[1].firstChild.nodeValue;
}
then later they are are looped through:
for (e=0; e<videototal; e++) {
//variables for grid spacing
thumbnails_fn(e);
}
and this is the function that loads in the images from the array. here is where i think the problem is. i'm not so clear on the MovieClipLoader class but is it possibel the tlistener.onLoadInit is getting called out of order for some reason?:
function thumbnails_fn(k) {
//thumbnail_mc._alpha = 0;
thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
tlistener = new Object();
tlistener.onLoadInit = function(target_mc) {
_root.clipcount = (_root.clipcount)+1;
trace(_root.clipcount);
if ((_root.clipcount>0) && (_root.clipcount<4)) {
target_mc._x = ((_root.slot)*77)+(_root.xstart);
_root.slot = (_root.slot)+1;
target_mc._y = 0;
if (_root.okfornewpage == 1) {
_root.pagecount = _root.pagecount+1;
_root.okfornewpage = 0;
nextvideo_btn._visible = true;
}
}
if ((_root.clipcount>3) && (_root.clipcount<7)) {
target_mc._x = ((_root.slot)*77)+(_root.xstart);
_root.slot = (_root.slot)+1;
target_mc._y = 92;
}
if ((_root.clipcount>6) && (_root.clipcount<10)) {
target_mc._x = ((_root.slot)*77)+(_root.xstart);
_root.slot = (_root.slot)+1;
target_mc._y = 184;
}
if (_root.slot == 3) {
_root.slot = 0;
}
if (_root.clipcount == 9) {
_root.xstart = _root.xstart+240;
_root.clipcount = 0;
_root.okfornewpage = 1;
//make it so page count goes up in other section
}
target_mc.linkValue = k;
target_mc.onRelease = function() {
p_link = this.linkValue;
tweenThumbAlpha();
//setLinks();
nextvideo_btn._visible = false;
backvideo_btn._visible = false;
};
target_mc.onRollOver = function() {
this._alpha = 50;
};
target_mc.onRollOut = function() {
this._alpha = 100;
};
};
image_mcl = new MovieClipLoader();
image_mcl.addListener(tlistener);
image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}
View Replies !
View Related
Thumbnail Gallery Image Select
I have a thumbnail gallery which only loads pictures from folder "pics" an they have to be example : pic1.jpg, thumbnails have to be th1.jpg. Where do I change the name of "loading folder" and possibility to change names of pictures and thumbnails ?
Code:
var tnNr;
spacing = 10;
container._alpha = 0;
var curLength;
MovieClip.prototype.loadPic = function(pic, id) {
info.text = "";
this._alpha = 0;
this.loadMovie(pic);
temp = this._parent.createEmptyMovieClip("temp2", 998);
temp.onEnterFrame = function() {
var t = container.getBytesTotal(), l = container.getBytesLoaded();
if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
var w = container._width+spacing, h = container._height+spacing;
border.resizeMe(w, h, id);
delete this.onEnterFrame;
}
};
};
MovieClip.prototype.resizeMe = function(w, h, id) {
var speed = 3;
container._alpha = 0;
this.onEnterFrame = function() {
this._width += (w-this._width)/speed;
this._height += (h-this._height)/speed;
if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
this._width = w;
this._height = h;
container._x = this._x-this._width/2+spacing/2;
container._y = this._y-this._height/2+spacing/2;
info._y = Math.round(this._y+this._height/2+spacing/2);
container._alpha += 5;
if (container._alpha>90) {
info.text = id;
container._alpha = 100;
delete this.onEnterFrame;
}
}
};
};
function galleryChoice(q) {
pArray = new Array();
tArray = new Array();
iArray = new Array();
my_xml = new XML();
for (var j = 0; j<curLength; j++) {
this.th_nav["thmb"+j].removeMovieClip();
}
my_xml.ignoreWhite = true;
my_xml.onLoad = function(loaded) {
if (loaded) {
gallery = this.firstChild.childNodes[q];
curLength = gallery.childNodes.length;
for (var i = 0; i<gallery.childNodes.length; i++) {
pArray.push(gallery.childNodes[i].attributes.source);
tArray.push(gallery.childNodes[i].attributes.thumb);
iArray.push(gallery.childNodes[i].attributes.title);
}
}
delay = setInterval(makeButtons, 50);
};
my_xml.load("gallery.xml");
}
function makeButtons() {
tnNr = 0;
clearInterval(delay);
for (var i = 0; i<tArray.length; i++) {
var thb = th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
thb.id = i;
thb._x = i%3*50;
thb._y = Math.floor(i/3)*50;
}
loadButtons();
}
function loadButtons() {
var tbox = th_nav["thmb"+tnNr].box;
tbox.loadMovie(tArray[tnNr]);
temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
temp.onEnterFrame = function() {
bt = tbox.getBytesTotal();
bl = tbox.getBytesLoaded();
if (bt == bl && bt>4) {
nextButton();
delete this.onEnterFrame;
}
};
}
function nextButton() {
if (tnNr<tArray.length-1) {
tnNr++;
loadButtons();
} else {
activateButtons();
}
}
function activateButtons() {
mainButtons();
for (var i = 0; i<pArray.length; i++) {
var but = th_nav["thmb"+i];
but.id = i;
but.onRelease = function() {
container.loadPic(pArray[this.id], iArray[this.id]);
disButtons2(this.id);
};
}
container.loadPic(pArray[0], iArray[0]);
disButtons2(0);
}
butArray = new Array();
butArray = ["gal1_btn", "gal2_btn", "gal3_btn", "gal4_btn"];
function mainButtons() {
for (var i = 0; i<butArray.length; i++) {
this[butArray[i]].id = i;
this[butArray[i]].onRelease = function() {
galleryChoice(this.id);
disButtons(this.id);
};
}
}
function disButtons2(d) {
for (var i = 0; i<tArray.length; i++) {
if (i != d) {
this.th_nav["thmb"+i].enabled = 1;
this.th_nav["thmb"+i].box._alpha = 100;
} else {
this.th_nav["thmb"+i].enabled = 0;
this.th_nav["thmb"+i].box._alpha = 50;
}
}
}
function disButtons(d) {
for (var i = 0; i<butArray.length; i++) {
if (i != d) {
this[butArray[i]].enabled = 1;
this[butArray[i]].gotoAndStop(1);
} else {
this[butArray[i]].enabled = 0;
this[butArray[i]].gotoAndStop(2);
}
}
}
disButtons(0);
galleryChoice(0);
View Replies !
View Related
Image Grid For Thumbnail(s) Display
Hello,
Yes, it's been awhile. I'm currently working on a web page design where I would like to have a vertical grid for thumbnail images [10 per category or per page] (left of page), When an image is selected, it's displayed in the assigned "Display Area" (right side of page). This is a Image Gallery type assignment, NO SCROLLING necessary. Any flash transition effects would be a plus to enhance the design interaction. Any tutorials that I can view and learn from? Any guidance in this area would be appreciated. I'm still with Flash MX....
...IfOnlyiNu
Thanx
View Replies !
View Related
Thumbnail + Larger Image Gallery
Hey yall I am trying to use an image_mc to load both the larger image and the thumbnails.
This all pulls from XML and works fine and dandy however to decrease storage space on server I only want to use one parameter of jpgs for the gallery and not save two sizes one for thumbnail and one for larger.
Is there a way to manipulate the image_mc which is being used by large photo with an identfier of picture, and then again for thumbnails as thumbnail_mc? I have tried to set the width and height of thumbnail_mc using:
Code:
thumbnail_mc.width = 90;
thumbnail_mc.height = 60;
However it is stilll loading the image as if it were loading it into the main picture_mc. Thus my scoller is of huge thumbnails. Any ideas?
View Replies !
View Related
Xml Thumbnail To Full Size Image
Hi everyone, I'm new to flash and actionscript and have been having a problem. I will try to explain the best I can.
I'm tring to have it when you click on a thumbnail, it loads a larger image over the scene.
Here is an example, since I'm sure that my desc. is awlful. link My scrolling thumbnails are based off of the tutorial on kirupa.com.
Here is my site. and action script. (architecture is only one that has any images on it currently for testing)
Code:
cliparray = [];
function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
thumbnails = [];
image = [];
total = xmlNode.childNodes.length;
for (i=0; i<total; i++) {
thumbnails[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
image[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
thumbnails_fn(i);
}
}
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");
// The scaleButton function takes 2 parameters. The name of
// the thumb thats being rolled over/out and the size to scale
// the thumb up or down by.
function scaleButton(btn:MovieClip, s:Number)
{
// We test this on every frame
btn.onEnterFrame = function()
{
// If the scale is at 95...
if(btn._xscale < s)
{
// then scale the thumb back up to 100(onRollOut)
btn._xscale += 1;
btn._yscale += 1;
}
// Otherwise, if the thumb is at 100...
else if(btn._xscale > s)
{
// scale the thumb down to 90(onRollver)
btn._xscale -= 1;
btn._yscale -= 1;
}
}
};
function thumbNailScroller() {
this.createEmptyMovieClip("tscroller", 1000);
scroll_speed = 9;
var tot = 0;
tscroller.onEnterFrame = function() {
if ((_root._ymouse>=thumbnail_mc._y) && (_root._ymouse<=thumbnail_mc._y+thumbnail_mc._height)) {
if (_root._xmouse>=(hit_right._x-40)){
for (var obj in cliparray) {
cliparray[obj]._x -= scroll_speed;
}
if (cliparray[0]._x<-cliparray[0]._width) {
cliparray[0]._x = cliparray[cliparray.length-1]._x+cliparray[cliparray.length-1]._width+15;
var j = cliparray.splice(0, 1);
cliparray = cliparray.concat(j);
}
} else if (_root._xmouse<=(hit_left._x+40)) {
for (var obj in cliparray) {
cliparray[obj]._x += scroll_speed;
}
if (cliparray[cliparray.length-1]._x>hit_right._x) {
cliparray[cliparray.length-1]._x = cliparray[0]._x-(cliparray[cliparray.length-1]._width+15);
var j = cliparray.splice(cliparray.length-1, 1);
cliparray = j.concat(cliparray);
}
}
}
}
};
function thumbnails_fn(k) {
// Makes the filter available to use in the Movie.
import flash.filters.DropShadowFilter;
// Creates a variable with info about the Filter settings
// Distance, Angle, Color, Alpha, Blur X, Blur Y, Strength, Quality, Inner, Knock Out, Hide
var myDropShadowFilter = new DropShadowFilter (4,45,0x000000,.5,5,10,2,15,false,false,false);
// Applies the filter to the object named myObject
thumbnail_mc.filters = [myDropShadowFilter];
var yy = thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
cliparray.push(yy);
tlistener = new Object();
tlistener.onLoadInit = function(target_mc) {
target_mc._x = 15+(target_mc._width+15)*k;
target_mc.pictureValue = k;
tot += target_mc._x;
target_mc.onRollOver = function() {
this._alpha = 70;
thumbNailScroller();
scaleButton(this, 95);
};
target_mc.onRollOut = function() {
this._alpha = 100;
scaleButton(this, 100);
};
};
image_mcl = new MovieClipLoader();
image_mcl.addListener(tlistener);
image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}
Any advice and help with be greatly appreciated. I have been all over google with no luck.
View Replies !
View Related
Load 30 Image, Thumbnail, N Swapdepths
Hello... i'm a flash newbie and learn AS hardly... pls help
i want to load 30 images to 30 empty mc's in same parent. my script is:
Code:
loadmovie ("komers1.jpg", "komers1");
loadmovie ("komers2.jpg", "komers2");
loadmovie ("komers3.jpg", "komers3");
// so on
loadmovie ("komers30.jpg", "komers30");
my question is:
1. how to make the script compact and more simple?
2. is it possible to rezise all imaged loaded to 20% it's original size? how to do that?
3. how to zoom in-out from thumbnail size.
after all image are loaded, i want visitor able click "komers1" mc (.. so on) and when the mc is clicked, it'll zoom to original size (100%) n go to highest level, covering others image. then zoom out back (20%) if visitor click again.
pls help me...
thx in advance
View Replies !
View Related
Image Portfolio - Thumbnail Layout
OK i'm an actionscript NOOB, and I did the tutorial thing on an XML Image portfolio!
http://www.kirupa.com/web/xml/examples/portfolio.htm
and! it works great! but! I want to put in a bunch of pictures - and I'd like them to fit in a box ---- kinda confusing
http://www.arwestudios.com/imageportfolio
-- this is the page i'm working on- notice how the last thumbnail goes off the white box- does anyone know if its possible to get the thumbnails to go down to the next line? -- and if not- if there's an easier way to accomplish the same thing.
--THANKYOU! for the help I love you
- here's my code- just in case your extra crazy
Code:
stop();
image_mc.setMask(mask_mc);
var thumb_spacing = 55;
// load variables object to handle loading of text
var description_lv = new LoadVars();
description_lv.onData = function(raw_text){
description_txt.text = raw_text;
}
function GeneratePortfolio(portfolio_xml){
var portfolioPictures = portfolio_xml.firstChild.childNodes;
for (var i = 0; i < portfolioPictures.length; i++){
var currentPicture = portfolioPictures[i];
var currentThumb_mc = menu_mc.createEmptyMovieClip("thumbnail_mc"+i,i);
currentThumb_mc._x = i * thumb_spacing;
currentThumb_mc.createEmptyMovieClip("thumb_container",0);
currentThumb_mc.thumb_container.loadMovie(currentPicture.attributes.thumb);
currentThumb_mc.title = currentPicture.attributes.title;
currentThumb_mc.image = currentPicture.attributes.image;
currentThumb_mc.description = currentPicture.attributes.description;
currentThumb_mc.onRollOver = currentThumb_mc.onDragOver = function(){
info_txt.text = this.title;
}
currentThumb_mc.onRollOut = currentThumb_mc.onDragOut = function(){
info_txt.text = "";
}
currentThumb_mc.onRelease = function(){
image_mc.loadMovie(this.image);
description_lv.load(this.description);
}
}
}
// xml object for xml content (defines sources for selections)
var portfolio_xml = new XML();
portfolio_xml.ignoreWhite = true;
portfolio_xml.onLoad = function(success){
if (success) GeneratePortfolio(this);
else trace("Error loading XML file"); // no success? trace error (wont be seen on web)
}
// load
portfolio_xml.load("portfolio.xml");
View Replies !
View Related
|
TRACKER
