Dynamic Image Gallery First, Next,Previous,Last

had a friend help me build this but now he's gone and I don't
understand arrays or coldfusion really. I have an image gallery
that works beautifully except that I want to be able to add two
behaviors to the page. 1.Pagination. 2. Display Record Count. (I
know how to use the Dreamweaver built in Server Behaviors with
Dynamic Tables but this is a little different from that b/c he's
using arrays to build the table instead. I've almost go the
pagination working. Except I can't figure how to show the last
record. I've got "First, Next, & Previous" to work. But the
"Last" doesn't. This is the part of the code that I'm concerned
with as everything else is working.
<cfset CountUp=Count + 10>
<cfset CountDown=Count - 10>
<p align="center"><cfif Count gte 1><a
href="gallery.cfm">First</a></cfif> <cfif
Count gte 10><a
href="gallery.cfm?Count=<cfoutput>#CountDown#</cfoutput>">Previous</a></cfif> <cfif
ArrayLen(PhotoArray) gt CountUp><a
href="gallery.cfm?Count=<cfoutput>#CountUp#</cfoutput>">Next</a></cfif><cfif
ArrayLen(PhotoArray) lt CountUp><a
href="gallery.cfm?Count=<cfoutput>#CountUp#</cfoutput>">Last</a></cfif>
I have no idea how to write the "Display record counts" so if
someone can help me write that part I would be so greatful.
Here is all of the code for this page attatched...
Attach Code

Your code is more complicated than it needs to be. I honestly
didn't dig through it, but here are a few suggestions.
Use ArrayLen(array[]) to count the number of rows in an aray.
Use array[ArrayLen(array)] to find the last record

Similar Messages

Page numbers navigation bar instead of the standard first-next-previous-last

I want to add page numbers to my navigationbar instead of the standard "first next previous last".
For example I have a repeat region with a navigation bar (standard) I have 7 records per page and I would like it to say at the bottom:
1 2 3 4 5 ect. Is there any way I can code this up with php or with dreamweaver or is there an other way to do this.
Any help welcome

You can do it in DW
Add the below code
<div class="pages">
<ul>
<li class="prev"><a href="#">« Previous</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li class="ellipsis"><strong>…</strong></li>
<li><a href="#">6</a></li>
<li class="current"><strong>7</strong></li>
<li><a href="#">8</a></li>
<li class="ellipsis"><strong>…</strong></li>
<li><a href="#">14</a></li>
<li><a href="#">15</a></li>
<li class="next"><a href="#">Next »</a></li>
</ul>
</div>
style it as
.pages{display:block; width:100%; text-align:center; clear:both; font-family:Verdana, Geneva, sans-serif;}
.pages ul{margin:0; padding:0; list-style:none;}
.pages li{display:inline;}
.pages strong{font-weight:normal;}
.pages .next{margin:0;}
.pages a,.pages .current strong, .pages .ellipsis strong{display:inline-block; padding:2px 6px; margin:0 2px 0 0;}
.pages a{border:1px solid #DFDFDF;}

First Next Previous Last

Hi,
In the standard toolbar when running MSA there you have the First, Next, Previous and Last buttons. What gets executed when you push these buttons? For the New button for example there is the beforeNew and afterNew event you can add, if you want to change something about the standard new button.
Im in a tile thats shows business parners, they are either a prospect OR a customer. And depending on if its a prospect OR a customer different fields should be made read-only etc.. i was able to make this work, but when using the First Next Previous Last buttons these field properties dont get updated when goin from a customer to a prospect and the other way around.
In what event or where should i put my "field-properties code" to fix this?
Cheers,
Maarten

Hi Maarten,
I don't know where you have put your code to change properties of those fields.
You would have to put your code in the <b>Your</b>Anchor_onUpdate.
Your anchor - is the anchor that the BO is tied to.
So, when you go First or Last, it executes _OnUpdate event.
Regards,
Vadim.

First Next Previous Last Behavior

I had a friend help me build this but now he's gone and I
don't understand arrays or coldfusion really. I have an image
gallery that works beautifully except that I want to be able to add
two behaviors to the page. 1.Pagination. 2. Display Record Count.
(I know how to use the Dreamweaver built in Server Behaviors with
Dynamic Tables but this is a little different from that b/c he's
using arrays to build the table instead. I've almost go the
pagination working. Except I can't figure how to show the last
record. I've got "First, Next, & Previous" to work. But the
"Last" doesn't. This is the part of the code that I'm concerned
with as everything else is working.
<cfset CountUp=Count + 10>
<cfset CountDown=Count - 10>
<p align="center"><cfif Count gte 1><a
href="gallery.cfm">First</a></cfif> <cfif
Count gte 10><a
href="gallery.cfm?Count=<cfoutput>#CountDown#</cfoutput>">Previous</a></cfif> <cfif
ArrayLen(PhotoArray) gt CountUp><a
href="gallery.cfm?Count=<cfoutput>#CountUp#</cfoutput>">Next</a></cfif><cfif
ArrayLen(PhotoArray) lt CountUp><a
href="gallery.cfm?Count=<cfoutput>#CountUp#</cfoutput>">Last</a></cfif>
I have no idea how to write the "Display record counts" so if
someone can help me write that part I would be so greatful.
Here is all of the code for this page attatched...

Hi Maarten,
I don't know where you have put your code to change properties of those fields.
You would have to put your code in the <b>Your</b>Anchor_onUpdate.
Your anchor - is the anchor that the BO is tied to.
So, when you go First or Last, it executes _OnUpdate event.
Regards,
Vadim.

Dynamic Image Gallerry First Previous Next Last

I had a friend help me build this but now he's gone and I
don't understand arrays or coldfusion really. I have an image
gallery that works beautifully except that I want to be able to add
two behaviors to the page. 1.Pagination. 2. Display Record Count.
(I know how to use the Dreamweaver built in Server Behaviors with
Dynamic Tables but this is a little different from that b/c he's
using arrays to build the table instead. I've almost go the
pagination working. Except I can't figure how to show the last
record. I've got "First, Next, & Previous" to work. But the
"Last" doesn't. This is the part of the code that I'm concerned
with as everything else is working.
<cfset CountUp=Count + 10>
<cfset CountDown=Count - 10>
<p align="center"><cfif Count gte 1><a
href="gallery.cfm">First</a></cfif> <cfif
Count gte 10><a
href="gallery.cfm?Count=<cfoutput>#CountDown#</cfoutput>">Previous</a></cfif> <cfif
ArrayLen(PhotoArray) gt CountUp><a
href="gallery.cfm?Count=<cfoutput>#CountUp#</cfoutput>">Next</a></cfif><cfif
ArrayLen(PhotoArray) lt CountUp><a
href="gallery.cfm?Count=<cfoutput>#CountUp#</cfoutput>">Last</a></cfif>
I have no idea how to write the "Display record counts" so if
someone can help me write that part I would be so greatful.
Here is all of the code for this page attatched...

Nobody's helping me

Next,previous,last, and first record

dear all masters
plz help me my code dont work
i used button when button pressed and code below
First_Record;
execute_query;
last_record;
execute_query;
previous_record;
execute_query;
next_record;
execute_query;
but all wont work it wont goto the next, previous,last and first records.. master plz help me..
micababe

How do I navigate to the last_record after a query has fetched all my records. I jnow it existed the POST-FETCH trigger, but now how can I make this possible?
My problem is simple. I am trying to navigate to the last record of a block after the query has fetched all the records.
Thanks,
Lucian

NEXT PREVIOUS LAST FIRST PROBLEM

hi to all,
i get this error when i press next,previous,last first button... "Error.. you need to insert first item" and another is when it work the last and first its empty in all the text item.....
my code is..
Next_REcord for next button
previous_record for previous
last_record for last
first_record for first...

If you want to navigate through the records of you 're data block you need records.
So first 'execute_query'. You can put this in when-new-form-instance trigger.
If there are no records in your table, it's normal that you get this error when trying to navigate.
Regards

Dynamic Image Gallery Issue

Hello All!
I am creating a dynamic image gallery, but when my external
images load in the empty movie clip, all the images are loading in
the same size/dimension. Does anyone know how I can command the MC
to load the images in different sizes, another words - to load them
according to its own size?
here's the AS
onClipEvent (load)
function imageMove()
var _loc1 = this;
for (i = 1; i <= num_of_image; i++)
mc = _loc1["image" + i];
if (i < hit)
tempx = small * (i - 1) + 30;
temps = small - 5;
mc.useHandCursor = true;
else if (i > hit)
tempx = big + small * (i - 2) + 30;
temps = small - 5;
mc.useHandCursor = true;
else
tempx = small * (i - 1) + 150; //distance of how far out the
displayed image jumps.
temps = big - 5; //distance between the displayed image and
thumbnails.
mc.swapDepths(1000);
display = txt
mc.useHandCursor = false;
} // end else if
mc._x = mc._x + (tempx - mc._x) / 3; //number of pixals on
x-axis the displayed image moves over to right side before growing
big.
mc._width = mc._width + (temps - mc._width) / 3; //number of
pixals on x-axis the displayed image moves over to left side before
growing big.
mc._height = mc._width * 4 / 3;
if (Math.abs(mc._width - temps) <= 1)
title._x = hit < 5 ? (_loc1["image" + hit]._x + big / 2) :
(_loc1["image" + hit]._x - big / 2 - 100);
title._y = 100;
} // end if
} // end of for
} // End of the function
function loopHye()
if (hit != num_of_image)
++_global.hit;
else
_global.hit = 1;
} // end else if
} // End of the function
getURL("FSCommand:allowscale", false);
big = 300;
//Large image width (400 works best for my portfolio site)
small = 60;//Small image width (40 works well for my
portfolio site)
num_of_image = 8;//Total number of images
timeGap = none;//Speed (speed of gaptime when each image is
displayed automatically. "2000" is default of this original file.
larger the number the slower the image changes. (type in "none"
will stop automatic images from changing.
_global.hit = 0;//First displyed image number (type "0" to
stop images from growing out)
txt = [" ", "image1", "image2", "image3", "image4", "image5",
"image6", "image7", "image8"];//insert text of each images between
for (i = 1; i <= num_of_image; i++)
attachMovie("image", "image" + i, i);
loadMovie("image/" + i + ".jpg", this["image" +
i].tar);//image folder path
mc = this["image" + i];
mc._x = small * (i - 1) + 30;
mc._y = 200; //where on the axis should the displays be.
mc._width = small - 5;
mc._height = mc._width * 4 / 3;
this["image" + i].onRelease = function ()
clearInterval(interval);
_global.hit = this._name.substr(5);
interval = setInterval(loopHye, timeGap);
} // end of for
interval = setInterval(loopHye, timeGap);
onClipEvent (enterFrame)
imageMove();
check out the file
http://www.wendiland.com/Gallery122b.fla
this is what the current gallery looks like
http://www.wendiland.com/print2.html
I'd appreciated if someone replies with any sort of
suggestions! thanks in advance!!!
- W£NDI

if you google with "dynamic image gallery", you'll find a lot
of
tutorials & examples including pre-programmed solutions
if you prefer to do it yourself, you need to deal with
dynamic sites. DW
help chapters Preparing to Build Dynamic Sites, Making Pages
Dynamic &
Developing Applications Rapidly can also help to understand
in fact you don't need a database, the images can be read
from the
folder they're stored. that way to update a gallery you only
need to
remove/replace/add images. one folder for each gallery
and the application development forum is best suited for your
question
BTW, some nice photos in your page
hth,
jdoe
uvi wrote:
> I'm trying to create a dynamic image gallery that is
updated from a database, i
> managed to create a simple mysql database
> using phpmy admin, so I could update my image gallery
more often, I saw
> something that I like but I have no idea how to create
it here is the example:
>
http://flight001.com/store/trip.htm?itemid=307&sid=201&page=2
> I didnt manage to create this with dynamic table from
within dreamweaver 8,
> maybe I just don't know how,
> this is the link to a gallery on my website:
>
http://www.yuvallavy.com/work/scenic/scenic.htm.
I need all the help I can get
> I'm using dreamweaver 8 on a Mac and using PHP/MySql
server model.
>

Dynamic Image Gallery AS2

I have dipped in almost every search engine and this site to
locate some easier way to create dynamic image gallery in Flash 8
AS2 using ASP (as i am conversant with ASP only, although i found
many sites suggesting PHP and XML). I'd be very greatful to u all
if u could provide me some help in this part of my project.
I have tried this source also but neither the source throw
any error nor it displays the images, what could be wrong with the
source? Please Please Please Please Please Help me!!!!!!!!
this.createClassObject(mx.containers.ScrollPane,
"scroller_sp", 10);
scroller_sp. setSize (100, 300);
swfThumbs=["imgs/img1.jpg","imgs/img2.jpg","imgs/img3.jpg"]
this.createEmptyMovieClip("clipLoader",1);
for(i=0;i< swfThumbs.length;i++){
clipLoader.createEmptyMovieClip("clip"+i+"_mc",i)
clipLoader.attachMovie("clip"+i+"_mc","clip"+i+"_mc",i+10);
clipLoader.loadMovieNum(swfThumbs
,i+100);
scroller_sp.contentPath = clipLoader;
thanks in anticipation and regards
raajaindra

Hi,
I have a picture show.
It creates its own folder when you first upload images with
the integrated Image uploader. Then it loads the images in with
ASP.
Have a look at
http://netwings.info
- click the B1 Image-show.
When you are interested, the contact is at the site.
Regards,
Luciewong

Dynamic image gallery on detail page

I have a master page listing 8 products. I have inserted a dynamic image gallery on the detail page which looks ok, but has one major flaw: when you click on a thumbnail the main image opens on the wrong page. e.g. if you click on page ../dragons.php?id=3 the main image opens on ../dragons.php/id=1 and shows the following url: .../dragons.php?image=btf.jpg (or whatever the image file name).
I have only just started using php and I would appreciate some guidance on how to resolve this problem.
The relevant sections of the code are as follows?
$vardragon_dragons_species = "1";
if (isset($_GET['id'])) {
$vardragon_dragons_species = $_GET['id'];
mysql_select_db($database_cjwebsite, $cjwebsite);
$query_dragons_species = sprintf("SELECT dragons.Order, dragons.family, dragons.Latin, dragons.English, dragons.Img1, dragons.Img2, dragons.Img3, dragons.img4, dragons.Img5, dragons.text, `dragons gallery`.filename, `dragons gallery`.caption, dragons.id, `dragons gallery`.image_id, dragons.id FROM dragons, `dragons gallery` WHERE dragons.id = `dragons gallery`.image_id AND dragons.id=%s", GetSQLValueString($vardragon_dragons_species, "int"));
$dragons_species = mysql_query($query_dragons_species, $cjwebsite) or die(mysql_error());
$row_dragons_species = mysql_fetch_assoc($dragons_species);
$totalRows_dragons_species = mysql_num_rows($dragons_species);
if (isset($_GET['image'])) {
$mainImage = $_GET['image'];
else {
$mainImage = $row_dragons_species['filename']; }
<body>
<div class="main_image"><img src="../images/dragons/<?php echo $mainImage; ?>" alt="<?php echo $row_dragons_species['caption']; ?>" />
<div class="capt"><?php echo $row_dragons_species['caption']; ?></div>
<ul class="gallery">
        <?php do {
      if ($row_dragons_species['filename'] == $mainImage) {
                 $row_dragons_species['caption'];
               }?>
<li><a href="<?php echo $_SERVER['PHP_SELF'];?>?image=<?php echo $row_dragons_species['filename']; ?>"><img src="../images/dragons/thumbs/<?php echo $row_dragons_species['filename']; ?>" alt="<?php echo $row_dragons_species['caption']; ?>" /></a></li>
<?php } while ($row_dragons_species = mysql_fetch_assoc($dragons_species)); ?>
</ul>
Many thanks
CJ

I'm still at an early stage in building this site and because it is allvery experimental I am and just using local testing.
So to try to explain my objective. I have a master page with 8 products there is a link to a detail page based on product id. So from the master page (dragons.php) you can select a product which will show the product information on a detail page (eg. dragons_species.php?id=1 or dragons_species.php?id=2 etc). This works ok.
Each detail page has various pieces of information and 5 images. I wanted to show the images in an image gallery format and so used the code you provide in your book PHP Solutions (Creating a Dynamic Online Gallery pp.323-330). This works ok on the first page where id=1, but on subsequent pages (id=2, id=3 etc) I am loosing the id link infavour of an image based link.
This is the complete script for my detail page (dragons_species.php)
<?php require_once('../Connections/cjwebsite.php'); ?>
<?php
if (!function_exists("GetSQLValueString")) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "")
if (PHP_VERSION < 6) {
    $theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
$theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);
switch ($theType) {
    case "text":
      $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
      break;
    case "long":
    case "int":
      $theValue = ($theValue != "") ? intval($theValue) : "NULL";
      break;
    case "double":
      $theValue = ($theValue != "") ? doubleval($theValue) : "NULL";
      break;
    case "date":
      $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
      break;
    case "defined":
      $theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
      break;
return $theValue;
$vardragon_dragons_species = "1";
if (isset($_GET['id'])) {
$vardragon_dragons_species = $_GET['id'];
mysql_select_db($database_cjwebsite, $cjwebsite);
$query_dragons_species = sprintf("SELECT dragons.Order, dragons.family, dragons.Latin, dragons.English, dragons.Img1, dragons.Img2, dragons.Img3, dragons.img4, dragons.Img5, dragons.text, `dragons gallery`.filename, `dragons gallery`.caption, dragons.id, `dragons gallery`.image_id, dragons.id FROM dragons, `dragons gallery` WHERE dragons.id = `dragons gallery`.image_id AND dragons.id=%s", GetSQLValueString($vardragon_dragons_species, "int"));
$dragons_species = mysql_query($query_dragons_species, $cjwebsite) or die(mysql_error());
$row_dragons_species = mysql_fetch_assoc($dragons_species);
$totalRows_dragons_species = mysql_num_rows($dragons_species);
if (isset($_GET['image'])) {
$mainImage = $_GET['image'];
else {
$mainImage = $row_dragons_species['filename']; }
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Odonata Species</title>
<link href="../Css/dragons.css" rel="stylesheet" type="text/css" />
<link href="../Css/menu.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="header">
<?php include('../Includes/logo2.inc.php'); ?>
</div>
<div id="content"> <div id="title">
<h1>Damselflies & Dragonflies</h1>
</div>
<div class="family")><?php echo $row_dragons_species['Order']; ?></div>
<div class="subfamily">
<?php echo $row_dragons_species['family']; ?>
<div class="main_image"><img src="../images/dragons/<?php echo $mainImage; ?>"   alt="<?php echo $row_dragons_species['caption']; ?>" />
   <div class="capt"><?php echo $row_dragons_species['caption']; ?></div></div></
   <div class="description">
    <div class="text" id="name"><?php echo $row_dragons_species['Latin']; ?></div>
    <div id="vernname"><?php echo $row_dragons_species['English']; ?></div>
<?php echo $row_dragons_species['text']; ?></div>
<ul class="gallery">
        <?php do {
                  if ($row_dragons_species['filename'] == $mainImage) {
                 $row_dragons_species['caption'];
               }?>
<li><a href="<?php echo $_SERVER['PHP_SELF'];?>?image=<?php echo $row_dragons_species['filename']; ?>"><img src="../images/dragons/thumbs/<?php echo $row_dragons_species['filename']; ?>" alt="<?php echo $row_dragons_species['caption']; ?>" /></a></li>
<?php } while ($row_dragons_species = mysql_fetch_assoc($dragons_species)); ?>
</ul>
<div id="footer">
    <?php include('../includes/footer.inc.php'); ?>
</div></div>
</div>
</body>
</html>
<?php
mysql_free_result($dragons_species);
?>
The code for my master page dragons.php is as follows
<?php require_once('../Connections/cjwebsite.php'); ?>
<?php
if (!function_exists("GetSQLValueString")) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "")
if (PHP_VERSION < 6) {
    $theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
$theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);
switch ($theType) {
    case "text":
      $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
      break;
    case "long":
    case "int":
      $theValue = ($theValue != "") ? intval($theValue) : "NULL";
      break;
    case "double":
      $theValue = ($theValue != "") ? doubleval($theValue) : "NULL";
      break;
    case "date":
      $theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
      break;
    case "defined":
      $theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
      break;
return $theValue;
mysql_select_db($database_cjwebsite, $cjwebsite);
$query_dragons_species = "SELECT id, Latin, English, Thumbs FROM dragons";
$dragons_species = mysql_query($query_dragons_species, $cjwebsite) or die(mysql_error());
$row_dragons_species = mysql_fetch_assoc($dragons_species);
$totalRows_dragons_species = mysql_num_rows($dragons_species);mysql_select_db($database_cjwebsite, $cjwebsite);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Odonata</title>
<link href="../Css/menu.css" rel="stylesheet" type="text/css" />
<link href="../Css/dragons.css" rel="stylesheet" type="text/css" />
<body>
<div id="header">
<?php include('../Includes/logo2.inc.php'); ?></div>
<div id="content"> <div id="title">
<h1>Damselflies</a> & Dragonflies</h1>
<div id="sidebar">
<?php include('../Includes/menu2.inc.php'); ?>
<div id="text">
<h2>ODONATA</h2>
    </h2>
<p>Ten species have been recorded on the islands, of which seven are common and widely distributed. The Golden-ringed Dragonfly and the Emerald Damselfly are both very scarce, whilst the record of the Azure-winged Dragonfly on Lewis is unconfirmed.
       <?php do { ?>
    <div class="speciesbox"><a href="Dragons_species.php?id=<?php echo $row_dragons_species['id']; ?>"><img src="../images/dragons/thumbs/<?php echo $row_dragons_species['Thumbs']; ?>" /></a>
        <div class="latin"><a href="Dragons_species.php?id=<?php echo $row_dragons_species['id']; ?>"><?php echo $row_dragons_species['Latin']; ?></a>
          <div class="english"><a href="Dragons_species.php?id=<?php echo $row_dragons_species['id']; ?>"><?php echo $row_dragons_species['English']; ?></a> </div>
    </div></div>
<?php } while ($row_dragons_species = mysql_fetch_assoc($dragons_species)); ?> </div>
<div id="footer">
    <?php include('../includes/footer.inc.php'); ?>
</div>
</body>
</html>
<?php
mysql_free_result($dragons_species);
?>
Does this shed any light?
Many thanks
CJ.

Dynamic image gallery

Hi all, I am new to the forum and I have a specific question
about a dynamic image gallery i am making.
Everything goes well, until I want to click from a thuimbnail
to see an enlarged image that is another file.
here is the specific code for that:
1) one problem is that -when I wlick one of the 5 jpegs
attached- I always see the last one enlarged...
2) another problem is to go back to the thumbs after clicking
the enlarged image...
PLease help me

One issue it might be, is that in your for loop you have var
i:Number=1; Set to 1 not 0. Then you referrence that number when
declaring your small and large images by i.
Remember actionscript always starts at zero not 1 when
creating objects dynamically.

I need a flash tutorial on Iphone style Scrolling Photo Gallery using Next/previous Buttons

Here i have attached two sample Fla files of iphone style scrolling photo gallery using next Previous buttons. Smoothscroller.fla is the original file download from internet and thumbscroll.fla is the one i m trying to make. But i m getting the actionscript error in the movieclip symbol 2 frame 2 actionscript frame. Can anyone work out on my file & send me the easiest tutorial of flash so that i can complete my portfolio project.
Mail me ur tutorials at : [email protected]

Just Google for the Spry photo gallery and you might find
http://cates-associates.net/tutorials/Tutorial-CS3-Spry.html
or even a few others.
Happy Sprying
Ben

Image gallery not removing previous image

Hi,
I have an image gallery but I can't seem to get the previous image removed. I have two functions:
[AS]function clearLoader():void {
try {
var li:LoaderInfo = slideLoader.contentLoaderInfo;
if(li.childAllowsParent && li.content is Bitmap){
   (li.content as Bitmap).bitmapData.dispose();
} catch(e:*) {}
}[/AS]
And
[AS]while(currentContainer.numChildren)
var obj:DisplayObject = currentContainer.getChildAt(0) as DisplayObject;
if (obj is Bitmap) {
Bitmap(obj).bitmapData.dispose();
currentContainer.removeChild(obj);
} else if (obj is MovieClip) {
currentContainer.removeChild(obj);
}[/AS]
But in some way not the previous image is removed, but the one before that. Annoying, because if image 1 is larger than image 2, image 1 stays on the background. It is only when loading image 3 the first image is removed from the stage. Any advice?
Thanks!
Dirk

Hi,
1. With the switchSlide() function:
function switchSlide(intSlide:int):void {
if(!Tweener.isTweening(currentContainer)) {
  if(slideTimer.running)
   slideTimer.stop();
  intCurrentSlide = intSlide;
  if(currentContainer == sprContainer2)
   currentContainer = sprContainer1;
  else
   currentContainer = sprContainer2;
  currentContainer.alpha = 0;
  mcSlideHolder.swapChildren(sprContainer2, sprContainer1);
  clearLoader();
  slideLoader = new Loader();
  slideLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, fadeSlideIn);
  slideLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, showProgress);
  var unesc_xmlSlideshow:XML = new XML(unescape(xmlSlideshow));
  slideLoader.load(new URLRequest(unesc_xmlSlideshow..image[intCurrentSlide].@src));
  mcInfo.lbl_description.text = unesc_xmlSlideshow..image[intCurrentSlide].@title;
  mcInfo.lbl_artist.text = unesc_xmlSlideshow..image[intCurrentSlide].@artist;
  strLink           = unesc_xmlSlideshow..image[intCurrentSlide].@link;
  strTarget          = unesc_xmlSlideshow..image[intCurrentSlide].@target;
  mcInfo.mcDescription.lbl_description.htmlText = unesc_xmlSlideshow..image[intCurrentSlide].@desc;
  mcInfo.lbl_count.text = " Slide " + (intCurrentSlide + 1) + " / " + intSlideCount2;
/AS
2. No images from other domains... just the ones on my webserver.

Adding "loading" movieclip to dynamic image gallery?

Hello again,
I've completed my XML-driven image gallery, however upon live testing I'd realized I made a rookie mistake and not put some kind of placeholder "loading" movie clip loop while the thumbnails—and subsequent full-size images—are being loaded. The images will randomly appear when loaded and I would like to be able to insert a placeholder movie clip while they load, and swap them up with the thumbnails/images after it has been loaded. The placeholder movie clip is in my library (loadingLoop), but I'm having problems getting it to work correctly.
Below is the original function that processes the XML and adds the thumbnail images; this is where I'm trying to insert the placeholder movie clip per XML child node (every attempt I've made just keeps throwing more errors, so I've omitted my attempts to avoid confusion), and I've attached the XML file for testing. And insight or help would be appreciated.
//Locate the external XML file and trigger xmlLoaded when complete
xmlLoader.load(new URLRequest("data/artGallery.xml"));
xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded);
//Load the XML and process the image locations
function xmlLoaded(event:Event):void {
    xml = XML(event.target.data);
    //parse the nodes in the XML file
    xmlList = xml.children();
    //count the number of nodes in the XML file via XMLList
    trace(xmlList.length());
    //loop to load all of the thumbnails, based on the number of nodes in XMLList
    //"i" = every child node in the XML file
    for (var i:int = 0; i < xmlList.length(); i++) {
        //Add loadingLoop movie clip per node and wait for thumnail to load before swapping out with imageLoader thumbnail images <-- help!!
        //for every node, create a new instance to be put on stage
        imageLoader = new Loader();
        //load each thumbnail from its location per XML node's "thumb" attribute
        imageLoader.load(new URLRequest(xmlList[i].attribute("thumb")));
        //position of thumbnail instances per XML node (horizontally across stage)
        imageLoader.x = i * 110 + 10;//thumbs are 100 x 100 so, +10 to the width, plus +10 from left edge
        //imageLoader.y = 10;
        //for each node in XML list, name the instance with the path to the location of the full size image
        imageLoader.name = xmlList[i].attribute("source");
        //for each node in the XML list, add a drop shadow
        imageLoader.filters = [thumbDShadow];
        //add thumbnails to stage
        addChild(imageLoader);
        dropTween = new Tween(imageLoader, "y", Bounce.easeOut, -100, 10, 1, true);
        //set up thumbnails to wait for a click to execute showPicture
        imageLoader.addEventListener(MouseEvent.CLICK, showPicture);
        //set up thumbnails to scale when rolled over
        imageLoader.addEventListener(MouseEvent.ROLL_OVER, sizeUP);

Somehow I had a feeling this wouldn't be a copy-and-paste job for the full-size images. Sorry to be a bother. This is the showPicture function that is fired off when the thumbnail image is clicked (from our previous example). Two errors are thrown:
When the thumnail is clicked:
"Error #2007: Parameter child must be non-null.
    at flash.display::DisplayObjectContainer/removeChild()
    at MethodInfo-51()"
But the full-size image loads nonetheless. The second loading loop (loadingLoop2) is not removed. Below is the showPicture function:
//Load the full-size images and place onto the stage
function showPicture(event:MouseEvent):void {
    //add new movie clip container
    var mc2:MovieClip = new MovieClip();
    addChild(mc2);
    //clear the fullLoader—this is to help clear any full-size images that may already be on the stage (they have two options, click a new thumbnail, or close the current full-size image
    fullLoader.unload();
    //re-create the fullLoader, if there was one cleared
    fullLoader = new Loader();
    //load each full size image from its location per XML node's "source" deliniated by mc.ldr's "source" attribute
    fullLoader.load(new URLRequest(event.target.name));
    //add the loder to the container
    mc2.addChild(fullLoader);
    //create new instance of second loading loop
    mc2.fsloop = new loadingLoop2();
    //add the second loading loop to the container
    mc2.addChild(mc2.fsloop);
    //for each container, add a drop shadow
    mc2.filters = [fullDShadow];
    //set the container's position center on stage, making it the size of the loading loop until the full-size images are loaded
    mc2.x = (stage.stageWidth - mc2.fsloop.width) * 0.5;
    mc2.y = (stage.stageHeight - mc2.fsloop.height) * 0.5;
    //place container on stage
    addChild(mc2);
    //fade in each container
    fadeTween = new Tween(mc2, "alpha", None.easeNone, 0, 1, 0.5, true);
    //check to see if the image has been loaded completely—this is to make sure the image's attributes can be used to re-center on stage and remove fsloop
    fullLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, removeLoop2);
    //set field to multiline so that the <br> HTML tags can be used
    imageTextField.multiline = true;
    //add text frame for description
    imageTextField.x = 10;
    imageTextField.y = 125;
    //for each full-size image, load the description text from the XML child nodes
    for (var j:int = 0; j < xmlList.length(); j++) {
        //check to make sure that the correct full-size image matches the text node when clicked
        if (xmlList[j].attribute("source") == event.target.name) {
            //add each child node as a separate line in the same text field; added HTML tags for CSS application
            imageTextField.htmlText = "<p><span class = 'projectName'>" + xmlList[j].child("projectName") + "</span><br>"
            + "<span class = 'toolsUsed'>" + xmlList[j].child("toolsUsed") + "</span><br><br>"
            + xmlList[j].child("projText") + "<br>"
            + "<span class = 'liveURL'>" + xmlList[j].child("liveURL") + "</span></p>";
    function removeLoop2(event:Event):void {
        //re-position the container to center on stage to accomodating the full sized image
        mc2.x = (stage.stageWidth - fullLoader.width) * 0.5;
        mc2.y = (stage.stageHeight - fullLoader.height) * 0.5;
        //Add the text field
        addText();
        //hide instructional text, already on stage
        galleryInfo_mc.alpha = 0;
        //remove the full-sized loading loop
        event.target.loader.parent.removeChild(MovieClip(event.target.loader.parent).loadingLoop2 );
    //set up full-size images to "self close" by clicking on it
    mc2.addEventListener(MouseEvent.CLICK, clearStage);
The second error gets thrown when the container is clicked and the function clearStage is executed, which does not remove the container:
"TypeError: Error #2007: Parameter child must be non-null.
    at flash.display::DisplayObjectContainer/removeChild()
    at artGallery_v1_5_fla::MainTimeline/clearStage()"
This is the clearStage function:
//Allow full-size image to "self close" by clikcing on it and removing the text description
function clearStage(event:MouseEvent):void {
    //clear the fullLoader
    fullLoader.unload();
    //remove the container
    event.target.parent.removeChild(MovieClip(event.target.parent).mc2);
   //remove the text field
    removeChild(imageTextField);
    //show the instructional text that is on-stage
    galleryInfo_mc.alpha = 1;
Help!

How can I create an image gallery with "next" buttons?

So I am almost done with my portfolio site (YES!)..now I just need the actual content (the images). My site is written in AS3.
I've watched many tutorials on how to create an image gallery (auto scrolling ones, scrolling ones that require mouse hover, etc etc), but those aren't what I am looking for.
I want a gallery that looks exactly like this one here:
http://jalbum.net/res/help/integrating-tutorial.html
I have a lot of work to display in my porfolio so there must be arrows at the end of the thumbnails so I can add more stuff. So I am just stumped on how to make the image gallery work with the ability to scroll for more photos with the click of the arrows.
Any ideas? Thank you.

Watching tutorials and learning from them are two different things. If you have learned from them you should be able to use what you have learned to devise a gallery such as the one you link to. If you have learned from them and cannot use what you learned, then you probably need to find/learn more.
If you study the design you linked you should be able to reason out what elements you need to devise... it is not overly complicated.
For the large picture you could have a Loader into which you load whatever image is selected from the thumnails. To get a brief transition you could just set the alpha of the Loader to 0 when an image change is occuring and gradually fade it in after the image has loaded.
The greatest challenge you are likely to face is in getting the thumbnails to advance back and forth depending on which is selected. All of the thumbs would be placed in a container (movieclip or sprite) and that would be masked so that only a portion of them is visible.
All thumbs that are not selected have their alpha property set to some value less than 1. Selecting one calls for the file it associates with to be loaded into the Loader. If the choice happens to lie off screen, then you need to move the movieclip that contains all of the thumbs some set value in the right (+x) or left (-x) direction.
If you want the thumbnails to wrap infinitely then when one leave the thumbnails area for movement in a direction, you need to take that thumb and relocate it to the other end of the thumbs in the container.

Dynamic Image Gallery First, Next,Previous,Last

Similar Messages

Maybe you are looking for