Multiple images in header...

First, I'm pretty new to Dreamweaver and working with HTML/CSS so newb friendly instructions/suggestions would be appreciated:
I'm attempting to add three images into the header of a 1 column liquid template. One small image for the left side which is a logo, one middle image which is a standard banner/header, and one image on the right which is a small graphic. However, if I try to insert more than one image into the header area - the second image will automatically drop down to a new line underneath the first and the so forth.
I'd like all of them to occupy the header in-line with each other.
As well, I'd like the left graphic (a logo) to align to the left edge, the middle image to stay centered, and the right image to align right automatically - so that the entire header will appear (somewhat) to expand or shrink with the main body column. I know enough to make any single image in the header auto-align where/how I'd like and how to set up a custom CSS rule... I just can't get all three images to appear in-line next to each other.
I've attempted to insert a 3 row table (no columns) in the header and then insert the images that way but the table didn't expand/shrink for the desired result. However, I'm sure there's likely a better solution anyway.
Thanks for the help in advance.

Ok, I think I've got an easy solution that's working now.
I just made the middle image a background to the header. And then added both the left and right images and floated them respectively to the sides. I believe this will let the header area expand and the right & left graphics will stay in relative position regardless of the viewer's screen resolution.
Here's the new relevant code:
.header {
    background-color: #000000;
    background-image: url(images/Header%20Middle.jpg);
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    height: 100px;
.logoleft {
    float: left;
    width: 100px;
    display: block;
    margin-right: auto;
.logoright {
    display: block;
    float: right;
    margin-left: auto;
    width: 100px;
Any problem with going with this as-is?

Similar Messages

How do I add multiple images into one file?

I'm sure this is something that's been covered in another post (or even in the help portal) but I think my wording in my search terms are not correct or... I don't know, because I just can't find what I'm looking for.
I want to know how to add multiple images into one file/one image, both horizontally and/or vertically. To give you an idea of what I mean, check out :
http://www.best10apps.com/apps/comic-story,531596060.html
If you scroll down, you'll see a heading entitled : Screenshots of Comic Story. Notice how there's 3 pictures (divided by borders). 2 of those pictures are side by side, and 1 of them is below the first 2 pictures.
I want to know how to add different pictures/images and put them into one picture.

One way is to create template PSD files and populate them with your images using Photoshops scripts.
Photo Collage Toolkit UPDATED June 12, added Picture Package Support via PasteImageRoll and BatchPicturePackage scripts.
The package includes four simple rules to follow when making Photo Collage Template PSD files so they will be compatible with my Photoshop scripts.
There are eleven scripts in this package they provide the following functions:
TestCollageTemplate.jsx - Used to test a Photo Collage Template while you are making it with Photoshop.
CollageTemplateBuilder.jsx - Can build Templates compatible with this toolkit's scripts.
LayerToAlphaChan.jsx - Used to convert a Prototype Image Layer stack into a template document.
InteractivePopulateCollage.jsx - Used to interactively populate Any Photo Collage template. Offers most user control inserting pictures and text.
ReplaceCollageImage.jsx - use to replace a populated collage image Smart Object layer with an other image correctly resized and positioned.
ChangeTextSize.jsx - This script can be used to change Image stamps text size when the size used by the populating did not work well.
PopulateCollageTemplate.jsx - Used to Automatically populate a Photo Collage template and leave the populated copy open in Photoshop.
BatchOneImageCollage.jsx - Used to Automatically Batch Populate Collage templates that only have one image inserted. The Collage or Image may be stamped with text.
BatchMultiImageCollage.jsx - Used to Automatically Batch Populate Any Photo Collage template with images in a source image folder. Easier to use than the interactive script. Saved collages can be tweaked.
BatchPicturePackage.jsx - Used to Automatically Batch Populate Any Photo Collage template with an image in a source image folder
PasteImageRoll.jsx - Paste Images into a document to be print on roll paper.
Documentation and Examples

Restrict image pixel size in multiple image upload

Re: Multiple Image Upload behaviour.
One of the only issues I have with this extension is if users try to upload an image within the limits I set (of 250Kb) but with a high pixel count.
For example, a jpg of 800 x 600 at 200Kb causes no problem, but a one of 2000 pixels at 150Kb probably will.
I understand that there is probably more server load to resize a large pixel image, so is there a way to check the pixel size of images to be uploaded as well as the file size and reject it if it is too large?

But what you could do, is retrieving the php.ini´s "post_max_size" value and display a note to your site visitors:
<br />
<br />
<b>1.</b> put this into the doc´s head:
<br />
<br /><?php<br />$replace_max_size_MB = str_replace("M"," MB",ini_get('post_max_size'));<br />?>
<br />
<br />
<b>2.</b> the related message:
<br />
<br />Pics larger than <?php echo $replace_max_size_MB; ?> will be rejected by the server
<br />
<br />Cheers,
<br />Günter Schenk
<br />Adobe Community Expert, Dreamweaver

Help with loading multiple images via LoadVars

Hello everybody.
I need a hand loading multiple images using the LoadVars
method with a text file. I can get it to load 1 image but not
anymore than that. I am aware of other methods like using
components but I am looking for a method where I can access and
change all data from 1 text file (there will be text variable text
within the file aswell to, but I am more concerned with the images
at the moment).
Anyway on to the issue. I have created a much simple .fla
file that outlines my problem.
The movie contains 3 layers:
- top layer contains AS
- middle layer contains an empty movie clip with the
instance name of mcImage1
- bottom layer contains an empy movie clip with the instance
name of mcImage2
The AS layer contains the following code:
imagedata = new LoadVars()
imagedata.load("data.txt")
imagedata.onLoad = function(ok){
if(ok){
mcImage1.loadMovie(this.Image1)
mcImage2.loadMovie(this.Image2)
} else trace("Problem Loading")
In the same folder of my .swf file I have a text file called
data.txt which contains the following
&Image1=image1.gif
&Image2=image2.gif
Also in the same folder of my .swf file I have two images
image1.gif and image2.gif.
When I run the flash the image2.gif is imported correctly.
image1.gif does not appear.
You can download my source files and all images here
http://www.myrealpage.com/projects/var_test/var_test.zip
Any help that can be shed on this problem is much
appreciated.
Thanks
Matt

Glad to help. It is just that I see so many folks who have
two different parts of a problem smushed together – each
problem isn't so hard on its own, but together they are difficult
to wrap your head around. Always try and break down each step of
the problem and it will help you in the end.
That being said, I'm not quite so sure on this next problem.
I don't do so much timeline stuff along with the Actionscript. I
can get tricky. So this I don't quite have as much of clear mental
picture of what you are describing. But here are some questions
that I would ask – either of myself if I was doing it or of
you.
Is there a stop() on frame one to wait for the
LoadVars.onLoad? Does the onLoad then say to play?
If not, what happens if we get to Frame 10 before the
LoadVars has even finished? That could be a problem.
Remember that the LoadVars object is an actual object that
will exist until it is deleted or removed in various ways. You can
access it at any time after it is loaded. The onLoad event handler
is just that thing you want to happen immediately after it is
loaded.
So my design would probably be.
LoadVars on Frame 1.
Where I am stopped.
In the onLoad handler load the first image and tell the
timeline to play
On frame 10, the LoadVars object will still exist (unless
you've deleted it)
Get the variable out of the LoadVars and load the image.
If you want to check this. Put a stop() in frame 10 and run
it in the testing environment. When it gets to that frame, go to
the debug menu and List Variables. You should see that your
LoadVars object is still there.
Does that answer your question or am I totally missing the
point?

Bringing in Multiple Images Together?

Hi everybody. Is there any way of bringing in multiple images at the same time into a HTML page in Dreamweaver? I am trying to place about 70 small thumb nails on the same page. At the moment I have to bring them all in, one at a time, which takes forever! If you could just select a folder and bring all the images in that folder in to your page together, ordered as they are in the folder that would be a lot quicker. Thanks for your help.

Copy & paste this code into a new, blank document. SaveAs gallery_test.php. Change php code to point to your Gallery/thumbs and Gallery/slides. If you don't have a local testing server, upload to your remote site to test.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 Document</title>


<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<link href="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.css" rel="stylesheet" media="screen">
<script src="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.pack.js"></script>
<style>
    padding: 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
body {
    margin: 0;
    padding: 0;
    background: #08035F;
    color: #333;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif;
    font-siz: 100%;
#wrapper {
    width: 1000px; /**adjust width in px or %**/
    margin: 0 auto; /**with width, this is centered**/
header {
    background: #355DA0;
    width: 100%;
    margin: 0 auto;
    color: #FFF;
#inner_wrapper {
    background: #CCC7B3;
    overflow: hidden; /**float containment**/
aside {
    float: left;
    width: 14%;
section {
    background: #FFF;
    width: 72%;
    float: left;
    margin: 0 auto;
/**Begin image gallery styles**/
.thumbs { /*divs that hold gallery pictures*/
    float: left;
    margin: 0.5%; /*space between thumbnails*/
    border: 1px dotted #CCC;
    /**same size images**/
    width: 135px;
    height: 99px;
    opacity: .70
.thumbs a { /* in every .thumbs div there is a hyperlink exactly the size of the container */
    width: 135px;
    height: 99px;
    text-indent: -99999px; /*move text links off screen*/
    display: block;
    outline: none;
/**on mouse over**/
.thumbs:hover { opacity: 1.0 }
/**end gallery styles**/
footer {
    clear: both;
    background: #222;
    width: 100%;
    color: #FFF;
    margin: 0 auto
</style>
</head>
<body>
<div id="wrapper">
<header> <h1>Header</h1>
<nav>Navigtion</nav>
</header>
<div id="inner_wrapper">
<aside> LEFT ASIDE </aside>
<section> <h2>Dynamic Thumbnails go here</h2>
<?php
$directory = 'GALLERY/thumbs'; //path to your thumbnails
$link = 'GALLERY/slides'; //path to your full-sized images
$allowed_types = array('jpg','jpeg','gif','png');
$aFiles = array();
$dir_handle = @opendir($directory) or die("There is an error with your image directory!");
while ($file = readdir($dir_handle)) //traverse through files
if($file=='.' || $file == '..') continue; //skip links to parent directories
$file_parts = explode('.',$file); //split filenames and put each part in an array
$ext = strtolower(array_pop($file_parts)); //last element is the file extension
$title = implode('.',$file_parts); //what's left is the filename
if(in_array($ext,$allowed_types))
$aFiles[] = $file; //filename array
closedir($dir_handle); //close directory
natsort($aFiles); // natural sort by filename 01, 02, 10, 20
$i=0;
foreach ($aFiles as $file) {
$file_parts = explode('.',$file); //split filenames and put each part in an array
$ext = strtolower(array_pop($file_parts)); //last element is the file extension
$title = implode('.',$file_parts); //what's left is the filename
$title = htmlspecialchars($title); //make it html-safe
echo '<div class="thumbs" style="background:url('.$directory.'/'.$file.') no-repeat 50% 50%">
<a class="fancybox" data-fancybox-group="gallery" href="GALLERY/slides/'.$file.'" title="'.$title.'">'.$title.'</a>
</div>';
$i++; //increment the image counter
?>

</section>
<aside> RIGHT ASIDE </aside>
</div>
<footer>Footer</footer>
</div>

<script>
$(document).ready(function() {
    $('.fancybox').fancybox();
</script>
</body>
</html>
Nancy O.

How do I stop iWeb outputting multiple image files? It makes my site slow!

I'm a professional web designer (but don't let that put you off) who uses Dreamweaver and also handcodes HTML & CSS websites at work on a PC, but having got a new Mac for home use I thought I'd give iWeb a go for a personal site hosted on .Mac, showcasing my music and film efforts, that I didn't want to have to think about coding.
I've built a short little site using the attractive 'Travel' theme, just 5 or 6 pages so far, and have not yet added any multimedia content. However, it seemed to take ages to upload it when I published it to .Mac. So then I went to view it, and it was soooo sloooow to download each page, even on my 4mb cable connection. I know it's a fairly graphically-rich theme, but still!
I noticed that it was redrawing the navigation menu each time... and upon close inspection of the HTML code using Safari's 'View Source' to my horror I found out that that each page has a seperate '_files' folder that contains multiple versions of files that are also used in other pages - including navigation buttons and background images. I also saw that every element has styling applied to it 'inline' in the code, rather than in a single seperate style-sheet.
To confirm this I published it to a folder on my hard drive and checked it all out. What a mess!
As a WYSIWYG web page editor iWeb is great but it's an undisputable fact that the HTML markup and CSS code it produces is absolutely appaling. What's worse though is that it also renders whole swaithes of text as images and that it does create seperate folders for each pages content including images, CSS code and navigation buttons - so even though the same images and code are used throughout the site for the background and buttons and layout, they are written out as seperate files and have to be reloaded with every page!!!
This means that the .Mac server must be getting hammered and webpages are very slow to download and slow to render in Safari - it's almost like dialup when I'm viewing my iWebsite, and like I said, I've got a 4mb cable connection!
Looking at the code iWeb produces, it is good to see that tables are not used for layout, and that's one thing in its favour. But surely the whole point of providing 'themed' templates for users is that the same content is used across the site and therefore doesn't need to be created multiple times - one of the benefits of using CSS stylesheets. Why doesn't iWeb create a single stylesheet and make efficient use of repeated images instead of creating multiple instances of the same file for each page?
Perhaps there is a setting somewhere I've missed. If so, let me know someone!
It is a great WYSIWYG editor, but behind the scenes it's not efficient, it's not clean and simple and it's certainly not attractive - and I'm surprised at that coming from Apple! I know iWeb is a great tool for beginners and I'm a picky professional, but if I was Joe Public First Time Web Designer I'd be very annoyed by this.
Clean it up and sort it out Mr Jobs!
PS: Also, where does iWeb store the website whilst it's in production? I can't find it anywhere?

Your iWeb Site is stored not on your iDisk, but on a file named Domain.sites in your ~/Home/Library/Application Support/iWeb/ Folder.
If , for whatever reason, you wipe your HD and/or lose this file (Get a new computer, Re-Install your OS, Stolen Laptop, Crashed HD, Etc.) without backing-up your Domain.sites file then you will have to re-build your iWeb sites from scratch again.
Of course you can edit your Published HTML files in a different program such as Dreamweaver or even Text Edit. You just can't edit Published HTML files in iWeb. Not at this time at least.
Use iWebBackup to backup your Domain file to a Blank CD or DVD. Backing up your Domain file to another folder on your computer is not fully backing it up. If your computer gets stolen you still lost the file but if you have your Domain file burned onto a CD you have a backup!
Download iWebBackup Here
You can use iWebExtender to automatically consolidate your files into one folder and delete multiple images.
http://iWebFAQ.com

Can you edit multiple images from a PDF in photoshop?

I scan a lot of old publications with images and drawings. The images are in greyscale, but my scanner produces better results set to color. As such, I have to convert the images to greyscale in Photoshop from Acrobat. I have several PS actions that make this process easier, but I wish there was a way to select multiple images from a page or PDF file and run the actions on them (a batch) instead of one at a time. Is there? Or perhaps another method than what I am doing?

I recommend that you scan first, save as TIFF, do any desired correction, and only then make PDFs. Scanning direct to PDFs is great for simple uncomplicated workflows, but a liability when correction is needed.

Is there a way to add multiple images at the same time to Keynote 6.0?

I just brought keynote after searching online about adding multiple images to a presentation all in one go - I couldn't do this on the powerpoint version I was using but there were multiple references on google to being able to do this on keynote. I purchased it and now can't get it to work! Any ideas anyone? Thanks

Do you mean like dragging in multiple images and having one image go on each slide? If so, you just drag the images into the Slide List on the left instead of onto the slide. From this prior post.
https://discussions.apple.com/message/9068283#9068283

Js-error while executing Multiple Image Upload wizard

If i want to save the configured window of Multiple Image Upload with Save to Database wizard i get this js-error: "While executing onClick in MIUploadWSaveWizard.htm, a JavaScript error occured".
can someone help?
thanx
peter

That again would be more of a question for the Cold Fusion group.
Try http://forums.adobe.com/community/coldfusion/coldfusion_administration
Those people will be able to help you out more.
Brad Lawryk
Adobe Community Expert, Dreamweaver
Adobe Usergroup Manager, Northern British Columbia Adobe User Group

Cannot select multiple images in iPhoto '08?

What am I doing wrong? I want to select multiple images to either print several on a page, or publish to a gallery, but for the life of me I cannot find a view which shows me all photo thumbnails or all thumbnails in an album or all in an event. I can spin the mousewheel to singly go through them, or I can hit edit and go to full screen where I get a thumbnail bar and can select multiples and view them at the same time, but printing or publishing this selection only recognizes the first photo as selected. If I try to select View>Thumbnails, the subsequent menu options are grayed out, and the top one is "hide" even though I see no thumbnail bar. Is there something very obvious I'm missing, or has something gone awry and I should reinstall?
<Edited by Host>
Any one can help them?
Thanks

There's a slider down right of the iPhoto Window - drag it left.
Regards
TD

File associations in Bridge CS4 for multiple images

After a "cache purge" my file associations got altered. I can go into Edit>preferences> file associations and change that to photoshop; but if I click MULTIPLE images in Bridge and right click "open with" I only get Illustrator as an option. How can I change this to photoshop as a default when trying to open MULTIPLE images?

Ronald Keller - thank you. I am practically in tears laughing about how something so completely simple has had me fretting for days. Could it be my over 60 mind has completely failed me now, or is it I am just a bit rusty on using my software? Anyway, thank you for taking the time to offer up this response!

Bridge CS4 won't output to pdf multiple images with same filename

Hiya...my googling efforts have thus far failed!
I've got CS4, and in Bridge, I created a New Smart Collection to find all filenames in a folder containing "." or ".jpg" - which in turn searched through all the subfolders like what you used to be able to do in Photoshop CS3. Very simple stuff, but all the images are jpg's, but in multiple folders (I don't want to move them out of the folders, as the files came from an external source, and there are heaps of folders, and I don't want to pdf each subfolder seperately as it will take forever).
The problem is that some of the files have the same filenames (again I'd prefer not to rename, as it happens a lot on this project, and they are all over the place). So whilst Bridge will show the thumbnail images correctly in the content tabbed screen in my New Smart Collection, but once I've done the Output to PDF thing, for example, instead of showing both different images it has pdf only the first image but repeated it twice. And this happens multiple times throughout the pdf, the more times the same filename is used, the more times the first image gets repeated.
I know that it is messy to have multiple similar filenames, but why can't bridge just place the image anyway? It allocated a space for it on the pdf and does show it in bridge, it just doesn't seem to survive the transfer to pdf well.
The only other thing that I have done is use the below link (which was posted on another adobe forum thread) to create a custom pdf output template (nothing too fancy, just number of rows / columns, size, font etc). But I've tried using the standard bridge templates and it does the same thing.
http://www.proficiografik.com/2009/08/03/save-custom-pdf-output-template-in-adobe-bridge-c s4.html
Any help would be appreciated...even if to tell me that I am being unreasonable!
UPDATE 16/11/09
Just to let you know that I seem to have resolved the bug inadvertently with one of the Adobe updates. The below is the link for the AdobeOutputModule-2.1-mul-AdobeUpdate.zip which was released on 2/19/2009 - which allows for headers & footers to be placed in the Ouput pdf. I finally installed it today, and everything seems to be working fine now (i.e. I can pdf multiple images with the same filenames and the pdf will actually show each different image rather than repeating only 1 of the images).
Must have been a fix installed in the contact sheet templates that get installed with the update - not sure why the original version was corrupted, but I've left that with the Adobe guys (I submitted a bug report - and they were able to replicate the problem but hadn't fixed it as yet).
http://www.adobe.com/support/downloads/detail.jsp?ftpID=4228
Message was edited by: djtun71 (16/11/09)

When I click import from disc I am asked to choose a disc and then I get this message:
The following photos will not be imported because they are already present in the catalog. To see these photos in the catalog select 'Show in Library' (the import will be canceled).
This is followed by a long list of images. If I click 'Show in Library' I can see all the images with the same filename. And then they start to automatically write over those images with images from the disc. However they keep the same metadata and keywords from the previous images. If I click on Import and deselect the "don't reimport suspected duplicates" box, it imports only the images that don't share filenames and none of the images that do.
Is there a way of setting the "Don't reimport suspected duplicates" box in preferences?

In the new iphoto app, why can't i save multiple images to camera roll at once?

why can't i save multiple images to camera roll at once? it seems i can only save one at a time and its very frustrating..
the options seem to be there, they are just greyed out and i cant click on them.
at first i thought its because the images were too big, so i tried it with smaller images but same thing.
APPLE HELP!

I can confirm @khaniff's original post the option in iPhoto for iOS is greyed out in conflict with the referenced article that follows:
Save to the Camera Roll
Tap a photo, album, or event and tap .
Tap Camera Roll.
Confirm or change the photos you want to share by tapping an option.
Select all the photos in an album or event: Tap All.
Select a range of photos: Tap Choose, tap Range, tap the first and last photos in the range, and tap Next.
To use your photo in another app, open the app and select the Camera Roll album.

I am getting a error IO when trying to upload multiple images within wordpress using the flash uploader. I do not get the error when uploading using explorer. The error only appears if I try uploading using firefox....any ideas?

I am getting a error IO when trying to upload multiple images within wordpress using the flash uploader. I do not get the error when uploading using explorer. The error only appears if I try uploading using firefox....any ideas?

Logged the call with SAP who directed me to 'Define settings for attachments' in IMG and setting the 'Deactivate Java Applet' & 'Deactivate Attachment versioning' checkboxes - problem solved.

Problem in Loading Multiple image in Single Sprite/MovieClip

Hi All,
I am having a killing problem in loading multiple images in single movie clip/sprite using a separate class.
Here is the ImageLoader.as class
package com.project.utils{
    import com.project.*;
    import com.project.utils.*;
    import flash.events.EventDispatcher;
    import flash.display.MovieClip;
    import flash.events.Event;
    import flash.events.ProgressEvent;
    import flash.display.Loader;
    import flash.events.IOErrorEvent;
    import flash.net.URLLoader;
    import flash.events.MouseEvent;
    import flash.net.URLRequest;
    import flash.display.Bitmap;
    public class ImageLoader extends EventDispatcher {
        public var imgloader:Loader;
        public var imgMc:MovieClip;
        public var imgObject:Object;
        public var loaded:Number;
        public function ImageLoader():void {
            imgMc = new MovieClip();
            imgObject = new Object();
            imgloader = new Loader();
        public function loadImage(imgHolder:MovieClip, imgObj:Object):void {
            imgMc = new MovieClip();
            imgObject = new Object();
            imgloader = new Loader();
            imgMc = imgHolder;
            imgObject = imgObj;
            imgloader.contentLoaderInfo.addEventListener(Event.COMPLETE,onImgLoad);
            imgloader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,onImgLoadProgress);
            imgloader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR,onImageLoadFailed);
            imgloader.load(new URLRequest(imgObj.FilePath));
        private function onImgLoad(Evt:Event):void {
            var image:Bitmap = Bitmap(Evt.target.content);
            try {
                imgMc.removeChildAt(0);
            } catch (error:Error) {
            imgMc.addChild(image);
            try {
                if (imgObject.URL != undefined) {
                    imgMc.buttonMode = true;
                    imgMc.removeEventListener(MouseEvent.CLICK, onImageClicked);
                    imgMc.addEventListener(MouseEvent.CLICK, onImageClicked);
            } catch (err:Error) {
            dispatchEvent(new CustomEvent("CustomEvent.ON_IMGE_LOAD"));
        private function onImageClicked(evt:MouseEvent):void {
            trace("Image Attrs:"+imgObject.URL +" Target "+imgObject.Target);
        private function onImgLoadProgress(Evt:ProgressEvent):void {
            if (Evt.bytesLoaded>0) {
                loaded = Math.floor((Evt.bytesLoaded*100)/Evt.bytesTotal);
                dispatchEvent(new CustomEvent("CustomEvent.ON_IMGE_LOAD_PROC",loaded));
        private function onImageLoadFailed(Evt:IOErrorEvent):void {
            trace("Image Loading Failed");
            dispatchEvent(new CustomEvent("CustomEvent.ON_IMGE_LOAD_FAIL"));
Here I am loading some images using the above class in a for loop, like
            for (var i=0; i < 3; i++) {
                //imgLoader=new ImageLoader;
                imgLoader.addEventListener("CustomEvent.ON_IMGE_LOAD",onImageLoad);
                var target:MovieClip=videolist_mc["list" + mcCount + "_mc"];
                target.list_mc.visible=false;
                var imgObj:Object=new Object;
                imgObj.FilePath=list[i].Thumbnail;
                imgObj.Url=list[i].Url;
                imgObj.Target=list[i].Target;
                target.list_mc.urlObj=new Object ;
                target.list_mc.urlObj=imgObj;
                imgLoader.loadImage(target.list_mc.imgholder_mc,imgObj);
                target.list_mc.lable_txt.htmlText="<b>" + list[i].Label + "</b>";
                target.list_mc.imgholder_mc.buttonMode=true;
                target.list_mc.imgholder_mc.addEventListener(MouseEvent.CLICK,onItemPressed);
                mcCount++;
In this case, the ImageLoader.as works only on the last movie clip from the for loop. For example, if i am trying to load three image in three movie clips namely img_mc1,img_mc2 and img_mc3 using the for loop and ImageLoader.as, I am getting the image loaded in the third movie clip only img_mc.
See at the same time, If i uncomment onething in the for loop that is
//imgLoader=new ImageLoader;
its working like a charm. But I know creating class objects in a for loop is not a good idea and also its causes some other problems in my application.
So, help to get rid out of this problem.
Thanks
-Varun

package com.project.utils{
    import com.project.*;
    import com.project.utils.*;
    import flash.events.EventDispatcher;
    import flash.display.MovieClip;
    import flash.events.Event;
    import flash.events.ProgressEvent;
    import flash.display.Loader;
    import flash.events.IOErrorEvent;
    import flash.net.URLLoader;
    import flash.events.MouseEvent;
    import flash.net.URLRequest;
    import flash.display.Bitmap;
    public class ImageLoader extends EventDispatcher {
        public var imgloader:Loader;
        public var imgMc:MovieClip;
        public var imgObject:Object;
        public var loaded:Number;
        public function ImageLoader():void {
// better add you movieclip to the stage if you want to view anything added to it.
            imgMc = new MovieClip();
            imgObject = new Object();
            imgloader = new Loader();
        public function loadImage(filepath:String):void {
            imgloader.contentLoaderInfo.addEventListener(Event.COMPLETE,onImgLoad);
            imgloader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,onImgLoadPr ogress);
            imgloader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR,onImageLoadF ailed);
            imgloader.load(new URLRequest(filepath));
        private function onImgLoad(Evt:Event):void {
            var image:Bitmap = Bitmap(Evt.target.content);
            try {
                imgMc.removeChildAt(0);
            } catch (error:Error) {
            imgMc.addChild(image);
            try {
                if (imgObject.URL != undefined) {
                    imgMc.buttonMode = true;
                    imgMc.removeEventListener(MouseEvent.CLICK, onImageClicked);
                    imgMc.addEventListener(MouseEvent.CLICK, onImageClicked);
            } catch (err:Error) {
            dispatchEvent(new CustomEvent("CustomEvent.ON_IMGE_LOAD"));
        private function onImageClicked(evt:MouseEvent):void {
            trace("Image Attrs:"+imgObject.URL +" Target "+imgObject.Target);
        private function onImgLoadProgress(Evt:ProgressEvent):void {
            if (Evt.bytesLoaded>0) {
                loaded = Math.floor((Evt.bytesLoaded*100)/Evt.bytesTotal);
                dispatchEvent(new CustomEvent("CustomEvent.ON_IMGE_LOAD_PROC",loaded));
        private function onImageLoadFailed(Evt:IOErrorEvent):void {
            trace("Image Loading Failed");
            dispatchEvent(new CustomEvent("CustomEvent.ON_IMGE_LOAD_FAIL"));
Here I am loading some images using the above class in a for loop, like
            for (var i=0; i < 3; i++) {
                var imgLoader:ImageLoader=new ImageLoader();
                imgLoader.addEventListener("CustomEvent.ON_IMGE_LOAD",onImageLoad);
                var target:MovieClip=videolist_mc["list" + mcCount + "_mc"];
                target.list_mc.visible=false;
                var imgObj:Object=new Object;
                imgObj.FilePath=list[i].Thumbnail;
                imgObj.Url=list[i].Url;
                imgObj.Target=list[i].Target;
                target.list_mc.urlObj=new Object ;
                target.list_mc.urlObj=imgObj;
                imgLoader.loadImage(pass the image file's path/name);
                target.list_mc.lable_txt.htmlText="<b>" + list[i].Label + "</b>";
                target.list_mc.imgholder_mc.buttonMode=true;
                target.list_mc.imgholder_mc.addEventListener(MouseEvent.CLICK,onItemPressed);
                mcCount++;

Multiple images in header...

Similar Messages

Maybe you are looking for