HELP with photo gallery in a table

I have a table that is acting as my photo gallery.
Each thumbnail pressed trigers the image to expand into the first column of the table. However, depending on whether I select a vertical or horizontal image, the rest of the thumbnails get shifted over to accommodate room for the large image.
My question is: is there a way to somehow FIX the dimensions of that first column so that the thumbails will stay in place??
Thanks.

Use CSS floats and margins to set up your gallery (view source to see the code).
http://alt-web.com/DEMOS/CSS-Image-Viewer.shtml
Nancy O.

Similar Messages

Help with Photo Gallery

I found this cool photo gallery tutorial
http://www.kirupa.com/developer/mx2004/xml_flash_photogallery.htm
but I'm having problem to put it together onto my flash web. I wold
like to make portfolio and I want to have several categories. Each
category will have its own photo gallery with animated buttons
loading in each gallery separately onto same area. something
similar to this
http://www.flashmint.com/show-template-1920.html
but where its loading text onto animated banners I want to load my
photo gallery. Any ideas how to put it together? I'm beginner with
action script . I use flash 8 proffesional

rest of the code here:
        <div id="previews">
            <div id="controls">
                <ul id="transport">
                    <li><a href="#" class="previousBtn" title="Previous">Previous</a></li>
                    <li><a href="#" class="playBtn" title="Play/Pause" id="playLabel"><span class="playLabel">Play</span><span class="pauseLabel">Pause</span></a></li>
                    <li><a href="#" class="nextBtn" title="Next">Next</a></li>
                </ul>
            </div>
            <div id="thumbnails" spry:region="dsPhotos" class="SpryHiddenRegion">
                <div class="thumbnail" spry:repeat="dsPhotos"><a href="{path}"><img alt="" src="{thumbpath}"/></a><br /></div>
                <p class="ClearAll"></p>
            </div>
        </div>
        <div id="picture">
            <div id="mainImageOutline"><img id="mainImage" alt="main image" src=""/><br /> Caption: {pcaption}</div>
        </div>
        <p class="clear"></p>
    </div>
Any help with getting the caption to display would be greatly appreciated. The Caption {pcaption} does not work,

Help with Photo Gallery using XML file

I am creating a photo gallery using Spry. I used the Photo Gallery Demo (Photo Gallery Version 2) on the labs.adobe.com website. I was successful in creating my site, and having the layout I want. However I would like to display a caption with each photo that is in the large view.
As this example uses XML, I updated my file to look like this:
<photos id="images">
            <photo path="aff2010_01.jpg" width="263" height="350" thumbpath="aff2010_01.jpg" thumbwidth="56"
               thumbheight="75" pcaption="CaptionHere01"></photo>
            <photo path="aff2010_02.jpg" width="350" height="263" thumbpath="aff2010_02.jpg" thumbwidth="75"
               thumbheight="56" pcaption="CaptionHere02"></photo>
            <photo path="aff2010_03.jpg" width="350" height="263" thumbpath="aff2010_03.jpg" thumbwidth="75"
               thumbheight="56" pcaption="CaptionHere03"></photo>
</photos>
The images when read into the main file (index.asp) show the images in the thumbnail area and display the correct image in the picture pain. Since I added the pcaption field to the XML file, how do I get it to display? The code in my index.html file looks like this:

rest of the code here:
        <div id="previews">
            <div id="controls">
                <ul id="transport">
                    <li><a href="#" class="previousBtn" title="Previous">Previous</a></li>
                    <li><a href="#" class="playBtn" title="Play/Pause" id="playLabel"><span class="playLabel">Play</span><span class="pauseLabel">Pause</span></a></li>
                    <li><a href="#" class="nextBtn" title="Next">Next</a></li>
                </ul>
            </div>
            <div id="thumbnails" spry:region="dsPhotos" class="SpryHiddenRegion">
                <div class="thumbnail" spry:repeat="dsPhotos"><a href="{path}"><img alt="" src="{thumbpath}"/></a><br /></div>
                <p class="ClearAll"></p>
            </div>
        </div>
        <div id="picture">
            <div id="mainImageOutline"><img id="mainImage" alt="main image" src=""/><br /> Caption: {pcaption}</div>
        </div>
        <p class="clear"></p>
    </div>
Any help with getting the caption to display would be greatly appreciated. The Caption {pcaption} does not work,

I need help with XML Gallery Fade in out transition. somebody please help me :(

I need help with XML Gallery Fade in out transition. somebody please help me
I have my post dont want to duplicate it

The problem doesn't lie with your feed, although it does contain an error - you have given a non-existent sub-category. You need to stick to the categories and sub-categories listed here:
http://www.apple.com/itunes/podcasts/specs.html#categories
Subscribing to your feed from the iTunes Store page work as such, but the episodes throw up an error message. The problem lies with your episode media files: you are trying to stream them. Pasting the URL into a browser produces a download (where it should play the file) of a small file which does not play and in fact is a text file containing (in the case of ep.2) this:
[Reference]
Ref1=http://stream.riverratdoc.com/RiverratDoc/episode2.mp3?MSWMExt=.asf
Ref2=http://70.33.177.247:80/RiverratDoc/episode2.mp3?MSWMExt=.asf
You must provide a direct link to the actual mp3 file. Streaming won't work. The test is that if you paste the URL of the media file (as given in the feed) into the address bar of a browser it should play the file.

Need help embedding photo gallery swf into main swf...

So I am attempting to create a website in flash and have the
main swf created for that. However, I've also created a photo
gallery in a separate swf which I want to embed into one of the
scenes in the main swf. I tried importing directly to stage, but
quickly realized that the timeline from the photo swf would not get
carried over. Basically, I know that it has to be accomplished
using AS, but don't know what that script would be. Any help would
be appreciated!

OK, well, that wasn't really a tutorial as much as it was
just a huge section of code I couldn't make sense of. Anyways,
instead of loading the gallery externally now I decided to just
make it in the actual main swf. So, basically, in the section of
the main swf reserved for the gallery I created an empty movie
clip, went inside the clip, created layers for script, thumbs and
photos. The photos themselves were in a movieclip of their own.
Each photo has a small fade in accomplished by staggering the
keyframes for each photo with a stop(); action on the last frame of
each photo where it comes to full opacity. The thumbnails are back
in the main movieclip where each button has code telling it to go
to the beginning of each photos transition and play. It is supposed
to play until it hits that stop action, but it won't play at all.
Suggestions?

Sharing with Photo gallery

Hello,
I am unable to email photos from Photo Gallery. The message says I need to create an association. I have tried to do this but I can't seem to locate any place to associate an email with the photo gallery program. Can you help please?

Photo Gallery is part of Windows Essentials. It is not a part of Windows 7. Go to
http://windows.microsoft.com/en-us/windows-live/essentials for the link to Windows Live Essential Support.
Also go to
http://windows.microsoft.com/en-us/windows-live/photo-gallery-share-photos-email-faq
Please remember to click “Mark as Answer” on the post that helps you, and to click “Unmark as Answer” if a marked post does not actually answer your question. This can be beneficial to other community members reading the thread. ”

Urgent Help with Image Gallery

Hi,
I really need help with an image gallery i have created. Cannot think of a resolution
So....I have a dynamic image gallery that pulls the pics into a movie clip and adds them to the container (slider)
The issue i am having is that when i click on this i am essentially clicking on all the items collectively and i would like to be able to click on each image seperately...
Please see code below
var xml:XML;
var images:Array = new Array();
var totalImages:Number;
var nbDisplayed:Number = 1;
var imagesLoaded:int = 0;
var slideTo:Number = 0;
var imageWidth = 150;
var titles:Array = new Array();
var container_mc:MovieClip = new MovieClip();
slider_mc.addChild(container_mc);
container_mc.mask = slider_mc.mask_mc;
function loadXML(file:String):void{
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.load(new URLRequest(file));
xmlLoader.addEventListener(Event.COMPLETE, parseXML);
function parseXML(e:Event):void{
xml = new XML(e.target.data);
totalImages = xml.children().length();
loadImages();
function loadImages():void{
for(var i:int = 0; i<totalImages; i++){
var loader:Loader = new Loader();
loader.load(new URLRequest("images/"+String(xml.children()[i].@brand)));
images.push(loader);
//      loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,onProgress);
     loader.contentLoaderInfo.addEventListener(Event.COMPLETE,onComplete);
function onComplete(e:Event):void{
imagesLoaded++;
if(imagesLoaded == totalImages){
createImages();
function createImages():void{
for(var i:int = 0; i < images.length; i++){
var bm:Bitmap = new Bitmap();
bm = Bitmap(images[i].content);
bm.smoothing = true;
bm.x = i*170;
container_mc.addChild(bm);
      var caption:textfile=new textfile();
      caption.x=i*170; // fix text positions (x,y) here
   caption.y=96;
      caption.tf.text=(xml.children()[i].@brandname)
      container_mc.addChild(caption);

yes, sorry i do wish to click on individual images but dont know how to code that
as i mentioned i have 6 images that load into an array and then into a container and i think that maybe the problem is that i have the listener on the container so when i click on any image it gives the same results.
what i would like is have code thats says
if i click on image 1 then do this
if i click on image 2 then do something different
etc
hope that makes sense
thanks for you help!

Help with photo albums Please

Hi, i really need some help with my pictures, I've only got a very basic understanding of how my phone works and have somehow put a load of albums on my phone when i plugged it into the computer-I want to delete some of them off the phone but cannot work out how to do it, when i plug my phone in i can find the photo tab but cannot actually see the pictures and can't see any delete button!!! Please can someone help me, basic explanations would be gratefully recieved xxxx

The photo sync is one way: computer to phone. To remove photos, synced to your phone, remove the check marks next to the albums/folders under the photos tab in itunes & hit the apply/sync button. They will be removed from your phone. You cannot delete photos that were synced to your phone, directly on your phone. The easiest way to manage photos synced to your phone is to create albums or folders on your computer. Move whatever photos you want on your phone into these albums/folders & then select them under the photos tab in itunes to sync to your phone. You can then remove or add photos to these various albums/folders on your computer & the itunes sync process will update your phone every time you sync.

Customise button wording for 'NEXT' that appears with Photo Gallery Thumbnails

Is it possible to customise the wording of the 'NEXT' button that appears with the photo gallery thumbnails? ie, if you only have 5 thumbnails on page, but the gallery has more pics, a NEXT button is generated, but we'd like it to say MORE IMAGES instead....

thank you!

Help with photo thumbnail generation process please.

Using Dreamweaver MX 2004 on Windows. I have several digital photos that I want to get into a table as 1x1 thumbnails that are linked to the actual photos. Each thumbnail would open up the actual picture by itself. I've seen software around that generates these types of pages programatically but I can't seem to find any. Can you folks suggest some options for me please? Thanks!
FREE would be good.

Do you mean a program that will generate thumbnails or a program that will generate the web gallery in a table? Or do you mean a program that will do both?
If you have several images - I take that to mean less than a dozen ;-) - you could look into using a lightbox script but that doesn't mean using a table and it would mean a little bit of coding.
I use a free image viewer called irfanView which according to the link below will generate a web gallery:
http://graphicssoft.about.com/cs/webgallery/ht/irfanwebgallery.htm
I have never used it for that. irfanview is used quite widely. Generally speaking, programs that generate a web gallery like this aren't often rated that much.
Martin

Need help with Photo Stream

I am having issues with Photo Stream and iPhoto when the iPhoto library is stored on a Drobo NAS. When I access the library stored on the NAS I see Photo Stream on the menu and when I access the library I get a message that tells me I need to switch Photo Stream to this Library. I did select to switch Photo Stream over to this NAS library and I did get a big blue button that is suppose to start Photo Stream but when I push it nothing happens.
I have contacted Apple support and they said that this is the way Photo Stream works and recommended that I submit a request to have this feature added at Apple\Feedback, if it is something I would like to have. They said if enough people request this feature they will add it but that Photo Stream does not currently support an iPhoto library stored on a remote NAS or shared network drive.
My question is has anyone found a work around for this? If you would like to have this feature added to Photo Stream can you please submit your request to Apple so they will add it, perhaps a little sooner than later?

I checked today and this issue has been solved with the latest iPhoto update from Apple. I am running iPhoto 9.2.3 on my Snow Leopard Server which is sharing a Drobo NAS. I am also running iPhoto 9.2.3 on my MBP running Lion and I can now open my iPhoto Library and Photostream will work with the library and even automatically create events and move all my Photostream pictures into these events within the Library. I can then close the Library on my MBP and open the same Library from my Snow Leopard server and the new Events are there and I can move them around with no problem. Thank you Apple for this fix. Even though I cannot deal with Photostream directly from the Snow Leopard server this is a very eligant work around.

Need help with saving data and keeping table history for one BP

Hi all
I need help with this one ,
Scenario:
When adding a new vendor on the system the vendor is suppose to have a tax clearance certificate and it has an expiry date, so after the certificate has expired a new one is submitted by the vendor.
So i need to know how to have SBO fullfil this requirement ?
Hope it's clear .
Thanks
Bongani

Hi
I don't have a problem with the query that I know I've got to write , the problem is saving the tax clearance certificate and along side it , its the expiry date.
I'm using South African localization.
Thanks

Help with this cool function: =SUMIF(Table 1::$Month, COLUMN()−1, $Cost)

Hello,
I am a novice with respect to spreadsheet functions and needed a a cashflow spreadsheet. I found this one (Download Cashflow Tracker for Numbers (iWork 09).) which is perfect but the author, I suspect, has not updated his website in years. I attempted contacting him and received no reply.
I receive an error with the following function:
=SUMIF(Table 1::$Month, COLUMN()−1, $Cost)
This occurs when I enter a date in the expense or income table. Entering the date is required to make the spreadsheet work but when I do I receive an error that a number is expected when a date is entered.
Can anyone give me some advice? I would really like to use this spreadsheet.
Thanks!
Steve

What I have found the simplest approach has been:
1. Cut the Summary by Category table and paste it into the Transaction sheet, giving something like this (after rearranging renaming, etc, as desired):
2. Make sure the links between the two table are still working, make their appearance the way you like, then duplicate that sheet for the other months. Each sheet will then have its separate set of two interconnected tables.
3. Copy paste one of the Summary tables back to the Summary sheet, rename it as desired, and set it up with formulas referencing the tables in the monthly sheets you have set up, something like this:
If you want your summary by month you would set up 12 columns in the main 'Summary by Category' table, with each column referencing a different sheet. Your Budget could be a row above each Actual figure, if you like, with difference in a row below that.
This approach keeps the formulas simple and avoids having to set up fancy SUMIFS extracting data for each month from one big Transaction table.
SG

Help with Photo booth

IS there a way that I can turn off the flash that happens when i take pictures with photo booth?
I was also wondering if the camera records video?
Thank you!

Hello Sarah CMac
To disable Photo Booth flash, hold shift while you click.
BTW, holding option disables the seconds countdown. You can use both at once if desired.
Photo Booth 2 that comes with Leopard adds video recording with "effects" and sound. If you do not want to upgrade to Leopard, you can use WebcamTweaker for "effects" videos or any of the apps that can record video or movie clips from this list of Some Applications You Can Use With iSight for video without Photo Booth's "effects."
EZ Jim
PowerBook 1.67 GHz w/Mac OS X (10.4.11) G5 DP 1.8 w/Mac OS X (10.5.1) External iSight

Need help with JavaScript "Galleria" gallery coding

I am trying to create a clickable gallery with the filmstrip either on the top or on left hand side for people to click to see my portfolio. I want the first photo to be auto loaded. I downloaded the javascript from;
http://galleria.aino.se/
I have the coding for;
galleria.js
galleria.classic.js
jquery.min.js
I try the basic tutorial given on the website http://galleria.aino.se/
but it seem more coding are needed.
I want the similar gallery as shown on the above website without the black void space on the side of the large photo. I do not want the Rewind and Fastforward buttons as shown on the side of the large photo (not on the thumbnail)
I have tried downloading few similer files and trying to use their html coding but there werent the full tutorial.
The coding below only shows two small photos left top of the page without the large photo either on top of them.
I dont understand much about coding. Only been doing this for like few months and still learning but i am stuck now. Much apperciated if you can help me out here with what code need to go where. Many thanks.
<!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>Untitled Document</title>
<script src="test/jquery.min.js"></script>
<script src="test/galleria.js"></script>
<script>Galleria.loadTheme('test/galleria.classic.js');</script>
<script>$('.gallery').galleria();</script>
</head>
<body>
<div class="gallery">
<a href="_images/home/Bridge.png"><img src="_images/home/Bridge.png" width="100"></a>
<a href="_images/home/Haz_Restaurant.JPG"><img src="_images/home/Haz_Restaurant.JPG" width="100"></a>
</div>
</body>
</html>

Using the same files, i have found a different code where they place the tumbnails at the bottom of the slideshow rather than on the side. Here is the code;
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>Galleria Demo 1</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta http-equiv="imagetoolbar" content="false">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link href="test/galleria.css" rel="stylesheet" type="text/css" media="screen">
    <script type="text/javascript" src="test/jquery.min.js"></script>
    <script type="text/javascript" src="test/jquery.galleria.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $('.gallery_demo_unstyled').addClass('gallery_demo'); // adds new class name to maintain degradability
        $('ul.gallery_demo').galleria({
            history   : true, // activates the history object for bookmarking, back-button etc.
            clickNext : true, // helper for making the image clickable
            insert    : '#main_image', // the containing selector for our main image
            onImage   : function(image,caption,thumb) { // let's add some image effects for demonstration purposes
                // fade in the image & caption
                image.css('display','none').fadeIn(1000);
                caption.css('display','none').fadeIn(1000);
                // fetch the thumbnail container
                var _li = thumb.parents('li');
                // fade out inactive thumbnail
                _li.siblings().children('img.selected').fadeTo(500,0.3);
                // fade in active thumbnail
                thumb.fadeTo('fast',1).addClass('selected');
                // add a title for the clickable image
                image.attr('title','Next image >>');
            onThumb : function(thumb) { // thumbnail effects goes here
                // fetch the thumbnail container
                var _li = thumb.parents('li');
                // if thumbnail is active, fade all the way.
                var _fadeTo = _li.is('.active') ? '1' : '0.3';
                // fade in the thumbnail when finnished loading
                thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500);
                // hover effects
                thumb.hover(
                    function() { thumb.fadeTo('fast',1); },
                    function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active
    </script>
    <style media="screen,projection" type="text/css">
    /* BEGIN DEMO STYLE */
    *{margin:0;padding:0}
    body{padding:20px;background:white;text-align:center;background:black;color:#bba;font:80% /140% georgia,serif;}
    h1,h2{font:bold 80% 'helvetica neue',sans-serif;letter-spacing:3px;text-transform:uppercase;}
    a{color:#348;text-decoration:none;outline:none;}
    a:hover{color:#67a;}
    .caption{font-style:italic;color:#887;}
    .demo{position:relative;margin-top:2em;}
    .gallery_demo{width:702px;margin:0 auto;}
    .gallery_demo li{width:68px;height:50px;border:3px double #111;margin: 0 2px;background:#000;}
    .gallery_demo li div{left:240px}
    .gallery_demo li div .caption{font:italic 0.7em/1.4 georgia,serif;}
    #main_image{margin:0 auto 60px auto;height:438px;width:700px;background:black;}
    #main_image img{margin-bottom:10px;}
    .nav{padding-top:15px;clear:both;font:80% 'helvetica neue',sans-serif;letter-spacing:3px;text-transform:uppercase;}
    .info{text-align:left;width:700px;margin:30px auto;border-top:1px dotted #221;padding-top:30px;}
    .info p{margin-top:1.6em;}
    </style>
</head>
<body>
<h1>Galleria Demo 01</h1>
<div class="demo">
<div id="main_image"></div>
<ul class="gallery_demo_unstyled">
    <li><img src="test/img/flowing-rock.jpg" alt="Flowing Rock" title="Flowing Rock Caption"></li>
    <li><img src="test/img/stones.jpg" alt="Stones" title="Stones - from Apple images"></li>
    <li class="active"><img src="test/img/grass-blades.jpg" alt="Grass Blades" title="Apple nature desktop images"></li>
    <li><img src="test/img/ladybug.jpg" alt="Ladybug" title="Ut rutrum, lectus eu pulvinar elementum, lacus urna vestibulum ipsum"></li>
    <li><img src="test/img/lightning.jpg" alt="Lightning" title="Black & White"></li>
    <li><img src="test/img/lotus.jpg" alt="Lotus" title="Fusce quam mi, sagittis nec, adipiscing at, sodales quis"></li>
    <li><img src="test/img/mojave.jpg" alt="Mojave" title="Suspendisse volutpat posuere dui. Suspendisse sit amet lorem et risus faucibus pellentesque."></li>
    <li><img src="test/img/pier.jpg" alt="Pier" title="Proin erat nisi"></li>
    <li><img src="test/img/sea-mist.jpg" alt="Sea Mist" title="Caption text from title"></li>
</ul>
<p class="nav"><a href="#" onclick="$.galleria.prev(); return false;">« previous</a> | <a href="#" onclick="$.galleria.next(); return false;">next »</a></p>
</div>

HELP with photo gallery in a table

Similar Messages

Maybe you are looking for