Javascript photo gallery

Im trying to put together a picture gallery using asp and
javascript i want to use a repeat region all my files are showing
but when i click the thumb nail the large image is not changing to
the thumbnail i want to view any know what ive done wrong?
</script>
</head>
<p><img
src="../../images/uploadedFiles/<%=(rs1.Fields.Item("Filename").Value)%>"
name="large" width="300" height="200" border="0"
align="middle"></p>
<p> </p>
<p> </p>
<table>
<%
startrw = 0
endrw = HLooper1__index
numberColumns = 3
numrows = -1
while((numrows <> 0) AND (Not rs1.EOF))
startrw = endrw + 1
endrw = endrw + numberColumns
%>
<tr align="center" valign="top">
<%
While ((startrw <= endrw) AND (Not rs1.EOF))
%>
<td><p> <a
href="javascript:image_click(0)"><img src= width="150"
height="110" name="pimage0" border=0></a>
<!---- THESE BLOCKS OF CODE CONTROL HOW THE IMAGES ARE
DISPLAYED-->
<script language="JavaScript"><!--
//thumbnail script
image0 =new Image();
// These 3 lines define the source of the displayed images
image0.src
="../../images/uploadedFiles/<%=(rs1.Fields.Item("Filename").Value)%>"
// This defines the source of the preview image
document.images['pimage0'].src=image0.src;
// This defines what to do when an image is clicked on
function image_click(clicks)
if(clicks==0){document.images['large'].src=image0.src;}
// --></script>

The part of iWeb pages that give the search engines problem is the navbar.  That's javascript based.  One way to get around that is to create another blank page in the site that's not  included in the navbar. 
Add a text based navbar in that page with just the other pages in the site. 
Also you can use that page for creating the sitemap for Google at Create your Google Sitemap Online - XML Sitemaps Generator.
Have you let Google know your site exists? This website describes how to get it recognized: Get your iWeb website found in search engines like Google Yahoo MSN and Bing.
OT

Similar Messages

  • Help with embedding Javascript for Lightbox Photo Gallery in Muse!

    Hi all:
    I am fairly new to Muse and I have been having trouble finding relevant information for embedding Javascript in order to get a lightbox to work in Muse. Would anyone be able to walk me through embedding the Javascript for the Lightbox Photogallery for Picasa in Muse?
    This is the code I want to use: Lightbox Photo Gallery and Slideshow for Picasa
    And this is the look I am trying to accomplish within my Muse site: Cycling Around The World / January 2006 / Picasa Template by www.paulvanroekel.nl
    Any help would be appreciate. Thanks much,
    Alexis

    Hi,
    I have tried inserting the script that you have pasted above as HTML on my test site and it worked.
    What happens is whenever you insert something as HTML, Muse by default creates a div tag and places the content within the div tag. What I have done differently is I have inserted the JS with in the <script> tag and it has inserted the Javascript in this manner,
    I beleive that since this a browser re-direct script that you are using, you would like to place this in the head section and not in the body tag, however, that is certainly not possible using Muse as it does not allow access to the code it generates as a muse file.
    You, can still export the pages as HTML and make the appropriate changes there before uploading to the server.
    Hope that helps.
    Regards,

  • How can i optimize my SEARCH ENGINE???I use godaddy.i contact them and they give me this conclusion:Search engines are not pulling up your other pages on your website because it is created with javascript. the content on the pages, (photo gallery.....

    conclusion from godaddy:
    Search engines are not pulling up your other pages on your website because it is created with javascript.
    the content on the pages, (photo gallery, My Recipes/Blog, History, Friends) need to be formatted to HTML, PHP or CSS. No search engines (google, Yahoo, Bing) can crawl//analyze webpages built with javascript.
    See if Apple allows iweb to create the pages in HTML format and ask how to make those changes.
    I spend more then 1 hour on the phone with them but we didn't find the solution...
    please i need help because like this nobody can rich my website...
    www.chefdiego.com
    thank you

    The part of iWeb pages that give the search engines problem is the navbar.  That's javascript based.  One way to get around that is to create another blank page in the site that's not  included in the navbar. 
    Add a text based navbar in that page with just the other pages in the site. 
    Also you can use that page for creating the sitemap for Google at Create your Google Sitemap Online - XML Sitemaps Generator.
    Have you let Google know your site exists? This website describes how to get it recognized: Get your iWeb website found in search engines like Google Yahoo MSN and Bing.
    OT

  • Photo Gallery in Dreamweaver

    I am updating a site that has a flash gallery displayed within a table cell.  I want to replace the flash (.swf) gallery with an html one that would be apple friendly.  Is there a way to embed an html/java slideshow within a table on a page? Lightroom exports an html page. Isn't there a way to link a lightroom gallery to dreamweaver the same way you would link photoshop to an image in indesign? easy edits easy display? Am I missing something? Maybe it is a huge pain to create an html gallery on a page... I just updated from cs4 so I don't know all of the available options.  Lightroom seemed like the way to go.

    There are many javascript photo galleries available online that you could use to do this. I would steer clear of anything that does it automatically (like Photoshop or Fireworks) as the code they generate is horrible.
    Look up "jquery slideshow" and you'll have literally hundreds to choose from with most giving a "how to" tutorial. It'll take some basic coding skills to do it though. If you're not ready for that, look into Project VII, they have paid extensions for DW that can do this for you from the Design View interface.

  • Data not dynamically updating in photo gallery

    The page in question is
    this
    photo gallery.
    The primary issue is when one thumbs through the images, the
    "photoID" does not update. It remains at the first "photoID" that
    is encountered, and in this case, it is 729. The "title",
    "description" and so forth remain locked to the first entry as
    well, yet the photograph updates "@path".
    I've been working at this for almost two days and have tried
    almost every possible combination. I've copied over the older
    framework files from my other site (which has this working
    successfully), modified it to work in this instance, and it fails
    here. The XML output is correct.
    function photogallery(){ //Photo gallery
    ?>
    <div class='right'>
    [Snip out collapse panel...]
    <div
    spry:detailregion="dsGallery">{photoID}</div>
    <div id="mainImageOutline"><img id="mainImage"
    alt="main image" src="{@path}" /></div>
    </div>
    <div class='left'>
    <div id='previews'>
    <div id='controls'>
    <div id='transport'>
    <a href='#' class='previousBtn'
    title='Previous'><img src='/res/images/buttons/rewind.png'
    alt='[skip-back]' border='0' /></a>
    <a href='#' class='playBtn' title='Play/Pause'
    id='playLabel'><span class='playLabel'><img
    src='/res/images/buttons/play.png' alt='[play]' border='0'
    /></span><span class='pauseLabel'><img
    src='/res/images/buttons/pause.png' alt='[pause]' border='0'
    /></span></a>
    <a href='#' class='nextBtn' title='Next'><img
    src='/res/images/buttons/fastforward.png' alt='[skip]' border='0'
    /></a>
    </div>
    </div>
    <div id='thumbnails' spry:region='dsGallery'>
    <div class='thumbnail' spry:repeat='dsGallery'><a
    href='{@path}'
    onclick=\"dsGallery.setCurrentRow('{ds_RowID}')\"><img alt=''
    src='{@path}' width="80" height="80" /></a></div>
    </div>
    </div>
    </div>
    <div style='clear: both;'> </div>
    <?
    }

    Even doing that was no help unfortunately. Here is an
    extended snippet,
    <!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"
    xmlns:spry="
    http://ns.adobe.com/spry">
    <head>
    <title>Urban Up, a web-site by Sherman
    Cahal</title>
    <meta http-equiv="Content-Type" content="text/xml;
    charset=utf-8" />
    <link rel="stylesheet" type="text/css" href="style.css"
    media="screen" />
    <script type="text/javascript"
    src="includes/SpryAssets/SpryEffects.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/SpryDOMUtils.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/SpryImageLoader.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/SpryNotifier.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/photogallery/SpryThumbViewer.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/photogallery/SpryImageViewer.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/photogallery/SprySlideShowControl.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/photogallery/gallery_init.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/xpath.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/SpryData.js"></script>
    <script type="text/javascript"
    src="includes/SpryAssets/photogallery/gallery_xds.js"></script>
    <script type="text/javascript">
    var dsGallery = new Spry.Data.XMLDataSet("<? echo
    $tmpfname; ?>", "/gallery/photos/photo");
    </script>
    </head>
    function photogallery(){ //Photo gallery
    ?><div class='right'>
    <div spry:detailregion="dsGallery">{photoID}
    <div id="mainImageOutline"><img id="mainImage"
    alt="main image" src="{@path}" /></div>
    </div>
    </div>
    <div class='left'>
    <div id='previews'>
    <div id='controls'>
    <div id='transport'>
    <a href='#' class='previousBtn'
    title='Previous'><img src='/res/images/buttons/rewind.png'
    alt='[skip-back]' border='0' /></a>
    <a href='#' class='playBtn' title='Play/Pause'
    id='playLabel'><span class='playLabel'><img
    src='/res/images/buttons/play.png' alt='[play]' border='0'
    /></span><span class='pauseLabel'><img
    src='/res/images/buttons/pause.png' alt='[pause]' border='0'
    /></span></a>
    <a href='#' class='nextBtn' title='Next'><img
    src='/res/images/buttons/fastforward.png' alt='[skip]' border='0'
    /></a>
    </div>
    </div>
    <div id='thumbnails' spry:region='dsGallery'>
    <div class='thumbnail' spry:repeat='dsGallery'><a
    href='{@path}'
    onclick=\"dsGallery.setCurrentRow('{ds_RowID}')\"><img alt=''
    src='{@path}' width="80" height="80" /></a></div>
    </div>
    </div>
    </div>
    <div style='clear: both;'> </div>
    <?
    And the XML file that is created:
    <?xml version="1.0" encoding="utf-8"?>
    <gallery base = "">
    <photos id = "images">
    <photo path="
    http://www.urbanup.net/content/20070629/photos/1_13_251.jpg">
    <photoID>729</photoID>
    <title>Downtown</title>
    <description><![CDATA[]]></description>
    </photo>
    <photo path="
    http://www.urbanup.net/content/20070629/photos/1_19_3.jpg">
    <photoID>834</photoID>
    <title></title>
    <description><![CDATA[A shared common area divides
    the new homes along South Mill.]]></description>
    </photo></photos></gallery>

  • Need "Rotate" Function in Photo Gallery

    All of my screen grabs end up 90 degrees rotated in PhotoGallery. There is no rotate function in Photo Gallery so to deal with these images I first open them in Adobe Editor on iPad and rotate them then save them to PhotoGallery.
    Is there a better way to do this?

    To the example that you have linked to above, make the following additions
      <div id="arch-container" style="position:relative;">
        <div id="arch-img" style="position:absolute; top: 170px;"><img src="images/arch-img.png" alt="arch_img" width="959" height="195" /></div>
      </div>
    I have used inline styles to make it easy on myself, but in reality you would put the style rules in the corresponding element selector in the CSS. Also, you would readjust the values to suit.
    Also, it is worth mentioning that placing a width and height on your image as you have done, should really be done using CSS.
    Added:
    As a side note, I have gotten into the habit of using classes for all of my style rules. I came to the conclusion that this is the way to go when trying to analyse a problem within my web page. ID's are unique per document and as such are used when manipulating the DOM using JavaScript. Now when I see an ID in one of my documents, I know that it is not a styling matter as in CSS, but a problem within my script.
    Take the above note as a thought, because there is a ongoing debate about this.
    Message was edited by: Altruistic Gramps

  • Photo Gallery start up problem

    I have a glitch and it's probably me … but here's what
    I know.
    About Don Booth's Photo Gallery:
    It's great. Everything is good - integrated with my CSS -
    looks nice.
    When the page loads all is well except the first image in the
    Gallery does not display in <div id="mainImageOutline"... (and
    the first thumbnail is not highlighted). While I'm building and
    testing this is OK. Just click a thumbnail and everything works
    well.
    In the demo, the Gallery is operational by default and starts
    up with the first thumbnail and Spry:detail produces the
    corresponding image (automatically). That's what I want.
    About my code:
    Except for a couple of "page layout" divs that I have,
    consistent with my own site-wide style sheet conventions, such as
    <div id="wrapper"> and <div id="maincontent"> I have:
    1. Copied Don Booth's xhtml code directly from the
    Spry_1_1_022408 download sample.
    2. Copied Don Booth's css code directly from the same
    download sample.
    3. Copied Don Booth's gallery.js directly (without change as
    far as I know).
    The only significant change (apart from CSS and xhtml
    structure) in my work is - I added an additional Spry:detail div to
    present additional datapoints from xml. This is not relevant to my
    question because the issue that concerns me is consistent if I
    remove this second detail div. The start-up problem remains.
    The URL for the gallery page in question is:
    http://www.yhqg.org/Celebration/quiltshow2008/galleryix/gallery.htm
    I imagine the problem is in gallery.js. You should know that
    javascript is a bit like dungeons and dragons to me.
    I have an error report:
    Error: dsPhotos is not defined
    Source File:
    http://www.yhqg.org/Celebration/quiltshow2008/galleryix/includes/gallery.js
    Line: 55
    So, when I see:
    var gAutoStartSlideShow;
    if (gAutoStartSlideShow == undefined)
    gAutoStartSlideShow = true;
    I imagine I'm looking at something useful but I don't know
    what to do with it, or if it is the right code to focus on. I
    respect the relationship with level 4 support engineers, but after
    trying to solve my own issue for a few weeks I decided it was time
    to submit my question. How do I get Photo Gallery to start up like
    the demo?
    Additional information:
    There is also a series of error reports that show when the
    Gallery is playing (for example):
    Warning: Expected end of value for property but found
    '-0.0775'. Error in parsing value for property 'opacity'.
    Declaration dropped.
    Source File:
    http://www.yhqg.org/Celebration/quiltshow2008/galleryix/gallery.htm
    Line: 0
    I don't think it is related, but that's what I know.
    I tried to copy my xhtml (below) but it caused this message
    to exceed allowed size. But I don't see that xhtml is the problem.
    You can see the source at the URL (above).

    Hi Latauro,
    Sounds like you need to turn your Slideshow into a Track, and then set the Track to display as 16:9 Letterbox; but first, you'll also need to encode your slides as wide Mpeg 2 clips (encode set to 16:9), too; to whatever duration you have them set in the Slideshow, currently (if they're not already wide encoded clips).
    It would be good to stick some same duration audible or silent same format and bit rate audio underneath each of the new movie slides, to present players a nicely packed VOB.
    Take care,
    Trai Forrester
    TFDVD Research Labs
    http://www.DVDVerification.com
    PS. If this helps you, would you please remember to declare the thread as "Solved". Although probably hopeless, someone should make a run to try and catch up with good Drew!! (see what happens Hal, when you take some time off?!

  • Photo Gallery Demo Problem

    I'm trying to understand the Photo Gallery demo so I can
    replicate the function for use on various sites. I've copied the
    html, xml, javascript and some of the photo file elements to my
    hard drive. I initially modified the file structures to something
    more of my liking, but had some problems with the links. I've since
    mimicked the structures so I can reduce the initial errors, but I
    am stumped at the var dsGallery and var dsPhotos statements that
    dynamically link to the China, Paris and Egypt photo databases. In
    the original dynamic definition, DreamWeaver only parses the
    dsGalleries XML definition, not defining the dsGallery and dsPhoto
    nodes. I wasn't too concerned about that given the variable nature,
    but nothing except the pull-down menu and controls displayed in the
    browser. DreamWeaver shows correct parsing of the dsGalleries XML,
    dsGallery and dsPhoto nodes only when I eliminate the dynamic
    linking and set it to one of the static links (Egypt). This fails
    in the browser to link to the data, giving a display that shows the
    correct number of empty thumbnail frames but without the displayed
    photos, no Spry effects, and no large photo display. I'm sure I
    have multiple reference errors, but I don't see them. Any ideas?
    Initial Photo Demo page:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN" "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <!-- Copyright (c) 2006. Adobe Systems Incorporated. All
    rights reserved. -->
    <html xmlns="
    http://www.w3.org/1999/xhtml"
    xmlns:spry="
    http://ns.adobe.com/spry">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=ISO-8859-1" />
    <title>Gallery</title>
    <link rel="stylesheet" type="text/css"
    href="../css/screen.css">
    <script type="text/javascript"
    src="../SpryAssets/xpath.js"></script>
    <script type="text/javascript"
    src="../SpryAssets/SpryData.js"></script>
    <script type="text/javascript"
    src="../SpryAssets/SpryEffects.js"></script>
    <script type="text/javascript">
    var dsGalleries = new
    Spry.Data.XMLDataSet("galleries/galleries.xml",
    "galleries/gallery");
    var dsGallery = new
    Spry.Data.XMLDataSet("galleries/{dsGalleries::@base}{dsGalleries::@file}",
    "gallery");
    var dsPhotos = new
    Spry.Data.XMLDataSet("galleries/{dsGalleries::@base}{dsGalleries::@file}",
    "gallery/photos/photo");
    </script>
    <script src="../SpryAssets/gallery.js"
    type="text/javascript"></script>
    </head>
    <body id="gallery">
    <noscript><h1>This page requires JavaScript.
    Please enable JavaScript in your browser and reload this
    page.</h1></noscript>
    <div id="wrap">
    <h1 id="albumName"
    spry:region="dsGallery">{sitename}</h1>
    <div id="previews">
    <div id="galleries" spry:region="dsGalleries">
    <label for="gallerySelect">View:</label>
    <select spry:repeatchildren="dsGalleries"
    id="gallerySelect"
    onchange="dsGalleries.setCurrentRowNumber(this.selectedIndex);">
    <option spry:if="{ds_RowNumber} == {ds_CurrentRowNumber}"
    selected="selected">{sitename}</option>
    <option spry:if="{ds_RowNumber} !=
    {ds_CurrentRowNumber}">{sitename}</option>
    </select>
    </div>
    <div id="controls">
    <ul id="transport">
    <li><a href="#" onclick="StopSlideShow();
    AdvanceToNextImage(true);"
    title="Previous">Previous</a></li>
    <li class="pausebtn"><a href="#" onclick="if
    (gSlideShowOn) StopSlideShow(); else StartSlideShow();"
    title="Play/Pause" id="playLabel">Play</a></li>
    <li><a href="#" onclick="StopSlideShow();
    AdvanceToNextImage();" title="Next">Next</a></li>
    </ul>
    </div>
    <div id="thumbnails" spry:region="dsPhotos dsGalleries
    dsGallery">
    <div spry:repeat="dsPhotos"
    onclick="HandleThumbnailClick('{ds_RowID}');"
    onmouseover="GrowThumbnail(this.getElementsByTagName('img')[0],
    '{@thumbwidth}', '{@thumbheight}');"
    onmouseout="ShrinkThumbnail(this.getElementsByTagName('img')[0]);">
    <img id="tn{ds_RowID}" alt="thumbnail for {@thumbpath}"
    src="galleries/{dsGalleries::@base}{dsGallery::thumbnail/@base}{@thumbpath}"
    width="24" height="24" style="left: 0px; right: 0px;" />
    </div>
    <p class="ClearAll"></p>
    </div>
    </div>
    <div id="picture">
    <div id="mainImageOutline" style="width: 0px; height:
    0px;"><img id="mainImage" alt="main image" /></div>
    </div>
    <p class="clear"></p>
    </div>
    </body>
    </html>
    Fixed reference version:
    <head>
    var dsGalleries = new
    Spry.Data.XMLDataSet("Graphics/galleries/galleries.xml",
    "galleries/gallery");
    var dsGallery = new
    Spry.Data.XMLDataSet("Graphics/galleries/egypt/Egyptphotos.xml",
    "gallery");
    var dsPhotos = new
    Spry.Data.XMLDataSet("Graphics/galleries/egypt/Egyptphotos.xml",
    "gallery/photos/photo");
    </script>
    Supporting files galleries.xml and Egyptphotos.xml
    <?xml version="1.0" encoding="UTF-8"?>
    <galleries>
    <gallery base="Graphics/galleries/egypt/"
    file="Egyptphotos.xml">
    <sitename>Egypt</sitename>
    <photographer>Don Booth</photographer>
    <contactinfo>
    http://www.adobe.com</contactinfo>
    <email>[email protected]</email>
    <security><![CDATA[]]> </security>
    </gallery>
    ... duplicate China and Paris declarations
    </gallery>
    </galleries>
    <?xml version="1.0" encoding="UTF-8"?>
    <gallery
    base = ""
    background = "#FFFFFF"
    banner = "#F0F0F0"
    text = "#000000"
    link = "#0000FF"
    alink = "#FF0000"
    vlink = "#800080"
    date = "1/10/2006">
    <sitename>Egypt Gallery</sitename>
    <photographer>Don Booth</photographer>
    <contactinfo>
    http://www.adobe.com</contactinfo>
    <email>[email protected]</email>
    <security><![CDATA[]]> </security>
    <banner font = "Arial" fontsize = "3" color =
    "#F0F0F0"> </banner>
    <thumbnail base
    ="../../gallery/galleries/egypt/thumbnails/" font = "Arial"
    fontsize = "4" color = "#F0F0F0" border = "0" rows = "3" col =
    "5"> </thumbnail>
    <large base ="../../gallery/galleries/egypt/images/" font
    = "Arial" fontsize = "3" color = "#F0F0F0" border = "0">
    </large>
    <photos id = "images">
    <photo
    path = "egypt_01.jpg"
    width = "350"
    height = "262"
    thumbpath = "egypt_01.jpg"
    thumbwidth = "75"
    thumbheight = "56">
    </photo>
    </photos>
    </gallery>

    Please delete this posting. I've found the full original
    information in the v1.6 pre-release information and will compare to
    that baseline.

  • Need help making javascript thumbnail gallery function in javascript tab menu

    Hello all,
    I have implemented a css/javascript tab menu on one of my html pages thanks to Chris Coyier (http://css-tricks.com/learning-jquery-fading-menu-replacing-content/), and within one of the tabs, which I labeled GALLERY, I am trying to place a thumbnail gallery curtosy of Trent (http://www.twospy.com/galleriffic/).
    Before trying to place it in the menu, I made the gallery on a seperate html page to make sure that I could get it to work.  It does. But when I place it in the menu it shows up on page load under the content of the first tab (labeled TOUR) and not in the gallery tab.  In addition, once I click on the "gallery" tab the other tabs stop showing their content.  I feel like I am missing something obvious. But I just can't figure out what.  If anyone can help I would greatly appreciate it.
    Thanks,
    Natalie
    Below is the code of my whole page:
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Tour template</title>
    <!--TABS-->
    <link rel="stylesheet" type="text/css" href="MenuFader/style.css">
    <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
            $(function(){
                $("#tour-button").css({
                    opacity: 0.3
                $("#gallery-button").css({
                    opacity: 0.3
                $("#page-wrap div.button").click(function(){
                    $clicked = $(this);
                    // if the button is not already "transformed" AND is not animated
                    if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
                        $clicked.animate({
                            opacity: 1,
                            borderWidth: 5
                        }, 600 );
                        // each button div MUST have a "xx-button" and the target div must have an id "xx"
                        var idToLoad = $clicked.attr("id").split('-');
                        //we search trough the content for the visible div and we fade it out
                        $("#contents").find("div:visible").fadeOut("fast", function(){
                            //once the fade out is completed, we start to fade in the right div
                            $(this).parent().find("#"+idToLoad[0]).fadeIn();
                    //we reset the other buttons to default style
                    $clicked.siblings(".button").animate({
                        opacity: 0.5,
                        borderWidth: 1
                    }, 600 );
    </script>
    <!--End Tabs-->
    <script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
    <style type="text/css">
    <!--
    #realtor panel {
        width: 1000px;
    body {
        background-color: #282828;
        margin: 0px;
    .style4 {color: #A1A1A1}
    -->
    </style>
    <!-- InstanceBeginEditable name="Gallery" -->
    <title>Example tour page</title>
    <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="Gallery/js/jquery.galleriffic.js"></script>
    <script type="text/javascript" src="Gallery/js/jquery.opacityrollover.js"></script>
    <script type="text/javascript">
                document.write('<style>.noscript { display: none; }</style>');
    </script>
    <link rel="stylesheet" type="text/css" href="Gallery/css/galleriffic-2.css">
    <link rel="stylesheet" type="text/css" href="Gallery/css/basic.css">
    <!-- InstanceEndEditable -->
    </head>
    <!-- InstanceBeginEditable name="body" -->
    <body>
    <div id="realtor panel"><table width="100%" border="0">
      <tr>
        <td width="18%"> <div align="center"></div></td>
        <td width="82%"> </td>
      </tr>
    </table>
    </div>
    <div id="page-wrap">
            <div id="tour-button" class="button">
                <img src="MenuFader/images/TOUR.png" alt="tour" class="button" />
            </div>
            <div id="gallery-button" class="button">
                <img src="MenuFader/images/GALLERY.png" alt="property gallery" class="button" />
            </div>
            <div id="info-button" class="button">
                <img src="MenuFader/images/INFO.png" alt="info" class="button" />
            </div>
            <div id="specs-button" class="button">
                <img src="MenuFader/images/SPECS.png" alt="specs" class="button" />
            </div>
            <div class="clear"></div>
      <div id="contents">
        <div id="tour">
          <script type="text/javascript">
    AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','wid th','1270','height','443','src','swf files/Tudor Arms interative floor plan','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movi e','swf files/Tudor Arms interative floor plan' ); //end AC code
    </script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="1270" height="443">
            <param name="movie" value="swf files/Tudor Arms interative floor plan.swf" />
            <param name="quality" value="high" />
            <embed src="swf files/Tudor Arms interative floor plan.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="1270" height="443"></embed>
          </object></noscript>
        </div>
        <div id="property gallery">
             <div id="container">
                    <div id="gallery" class="content">
                        <div id="controls" class="controls"></div>
                        <div class="slideshow-container">
                            <div id="slideshow" class="slideshow"></div>
                        </div>
                    </div>
                    <div id="thumbs" class="navigation">
                        <ul class="thumbs noscript">
                            <li>
                                <a class="thumb" href="Gallery/images/example/apt entrance1.jpg">
                                <img src="Gallery/images/example/Tudor thumbs/apt face1.jpg" alt="apt entrance1" />
                                </a>
                           </li>
                          <li>
                                <a class="thumb" href="Gallery/images/example/apt entrance2.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/apt face2.jpg" alt="apt entrance2" />
                                </a>
                          </li>
                          <li>
                                 <a class="thumb" href="Gallery/images/example/apt entrance3.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/apt face3.jpg" alt="apt entrance3" />
                              </a>
                          </li>   
                            <li>
                                 <a class="thumb" href="Gallery/images/example/apt sign.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/apt sign.jpg"  alt="apt sign" />
                              </a>
                          </li>
                          <li>
                                 <a class="thumb" href="Gallery/images/example/entryway1.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/entry.jpg" alt="entry" />
                              </a>
                          </li>
                            <li>
                                 <a class="thumb" href="Gallery/images/example/living room1.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/living1.jpg"  alt="living1" />
                              </a>
                          </li>
                           <li>
                                 <a class="thumb" href="Gallery/images/example/living room2.jpg" >
                                 <img src="Gallery/images/example/Tudor thumbs/living2.jpg" alt="living3" />
                              </a>
                          </li>
                            <li>
                                 <a class="thumb" href="Gallery/images/example/living room3.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/living3.jpg"  alt="living3" />
                              </a>
                          </li>
                          <li>
                                 <a class="thumb" href="Gallery/images/example/dining1.jpg" >
                                 <img src="Gallery/images/example/Tudor thumbs/dining1.jpg"  alt="dining1" />
                              </a>
                          </li>
                            <li>
                                 <a class="thumb" href="Gallery/images/example/Dining2.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/dining2.jpg"  alt="dining2" />
                              </a>
                          </li>
                          <li>
                                 <a class="thumb" href="Gallery/images/example/dining3.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/dining3.jpg" alt="dining3" />
                              </a>
                          </li>
                            <li>
                                 <a class="thumb" href="Gallery/images/example/Kitchen1.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/kitchen1.jpg"  alt="kitchen1" />
                              </a>
                          </li>
                          <li>
                                 <a class="thumb" href="Gallery/images/example/Kitchen2.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/kitchen2.jpg" alt="kitchen2" />
                              </a>
                          </li>
                            <li>
                                 <a class="thumb" href="Gallery/images/example/bedroom1.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/bed1.jpg"  alt="bed1" />
                              </a>
                          </li>
                           <li>
                                 <a class="thumb" href="Gallery/images/example/bedroom2.jpg">
                                <img src="Gallery/images/example/Tudor thumbs/bed2.jpg"  alt="bed2" />
                              </a>
                          </li>
                            <li>
                                 <a class="thumb" href="Gallery/images/example/bedroom3.jpg" >
                                <img src="Gallery/images/example/Tudor thumbs/bed3.jpg"  alt="bed3" />
                              </a>
                          </li>
                            <li>
                                 <a class="thumb" href="Gallery/images/example/bathroom.jpg">
                                <img src="Gallery/images/example/Tudor thumbs/bath.jpg"  alt="bath" />
                              </a>
                            </li>
                        </ul>
                    </div>
                <div style="clear: both;"></div>
            </div>
        </div>
        <div id="info">
            <p class="style4">Content for info</p>
        </div>
        <div id="specs">
            <p class="style4">This content is for specs.</p>
        </div>
      </div>
    </div>
    <!--script for gallery-->
    <script type="text/javascript">
                jQuery(document).ready(function($) {
                    // We only want these styles applied when javascript is enabled
                    $('div.navigation').css({'width' : '400px', 'float' : 'left'});
                    $('div.content').css('display', 'block');
                    // Initially set opacity on thumbs and add
                    // additional styling for hover effect on thumbs
                    var onMouseOutOpacity = 0.67;
                    $('#thumbs ul.thumbs li').opacityrollover({
                        mouseOutOpacity:   onMouseOutOpacity,
                        mouseOverOpacity:  1.0,
                        fadeSpeed:         'fast',
                        exemptionSelector: '.selected'
                    // Initialize Advanced Galleriffic Gallery
                    var gallery = $('#thumbs').galleriffic({
                        delay:                     2500,
                        numThumbs:                 15,
                        preloadAhead:              10,
                        enableTopPager:            true,
                        enableBottomPager:         true,
                        maxPagesToShow:            7,
                        imageContainerSel:         '#slideshow',
                        controlsContainerSel:      '#controls',
                        captionContainerSel:       '#caption',
                        loadingContainerSel:       '#loading',
                        renderSSControls:          true,
                        renderNavControls:         true,
                        playLinkText:              'Play Slideshow',
                        pauseLinkText:             'Pause Slideshow',
                        prevLinkText:              '&lsaquo; Previous Photo',
                        nextLinkText:              'Next Photo &rsaquo;',
                        nextPageLinkText:          'Next &rsaquo;',
                        prevPageLinkText:          '&lsaquo; Prev',
                        enableHistory:             false,
                        autoStart:                 false,
                        syncTransitions:           true,
                        defaultTransitionDuration: 900,
                        onSlideChange:             function(prevIndex, nextIndex) {
                            // 'this' refers to the gallery, which is an extension of $('#thumbs')
                            this.find('ul.thumbs').children()
                                .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
                                .eq(nextIndex).fadeTo('fast', 1.0);
                        onPageTransitionOut:       function(callback) {
                            this.fadeTo('fast', 0.0, callback);
                        onPageTransitionIn:        function() {
                            this.fadeTo('fast', 1.0);
    </script>  
    </body>
    <!-- InstanceEndEditable -->
    <!-- InstanceEnd --></html>

    Sure thing:
    http://www.acresllc.net/TA501001.html

  • Problem in responive photo gallery

    I have inserted the yoxview  photo gallery from this website http://www.yoxigen.com/yoxview/.Here is the code.
    <!doctype html>
    <!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
    <!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
    <!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
    <!--[if gt IE 8]><!-->
    <html class=""><!-- InstanceBegin template="/Templates/Vestrytemplate.dwt" codeOutsideHTMLIsLocked="false" -->
    <!--<![endif]-->
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>Photo Gallery</title>
    <script type="text/javascript" src="yoxview/yoxview-init.js">
    </script>
    <script type="text/javascript" src="yoxview/yoxview-nojquery.js"></script>
    <script type="text/javascript">
                $(document).ready(function(){
                    $("#thumbnails").yoxview({
                     backgroundColor: 'Blue',
                     playDelay: 5000
    </script>
    <link href="yoxview/yoxview.css" rel="stylesheet" type="text/css">
    <!-- InstanceEndEditable -->
    <link href="boilerplate.css" rel="stylesheet" type="text/css">
    <link href="CSS/Layout.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="flexslider.css" type="text/css">
    <link href="css/flexnav.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    body {
        background-color: #E9E9E9;
    </style>
    <style>
    footer
        min-height: 80px;
        background: #000;
        border-top-width: 2px;
        border-top-style: solid;
        border-top-color: #C7E003;
    </style>
    <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>-->
    <script src="jquery.min.js"></script>
    <script src="jquery.flexslider.js"></script>
    <!-- Place in the <head>, after the three links -->
    <script type="text/javascript" charset="utf-8">
      $(window).load(function() {
        $('.flexslider').flexslider();
    </script>
    <!--
    To learn more about the conditional comments around the html tags at the top of the file:
    paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
    Do the following if you're using your customized build of modernizr (http://www.modernizr.com/):
    * insert the link to your js here
    * remove the link below to the html5shiv
    * add the "no-js" class to the html tags at the top
    * you can also remove the link to respond.min.js if you included the MQ Polyfill in your modernizr build
    -->
    <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <!--[if lt IE 9]>
    <link href="IE-only.css" rel="stylesheet" type="text/css">
    <![endif]-->
    <script src="respond.min.js"></script>
    <!-- InstanceBeginEditable name="head" -->
    <!-- InstanceEndEditable -->
    </head>
    <body>
    <div class="gridContainer clearfix">
      <div id="LayoutDiv1"><img src="SJV-Images/Banners/LimeGreenheader-new-curved.png"/></div>
      <div id="Nav">
    <div class="menu-button">Navigation</div>
        <nav>
              <ul data-breakpoint="800" class="flexnav">
                <li><a href="">Home</a>
               <!--   <ul>
                    <li> <a href="#content">Sub 1 Item 1</a></li>
                    <li><a href="">Sub 1 Item 2</a></li>
                    <li><a href="">Sub 1 Item 3</a></li>
                    <li><a href="">Sub 1 Item 4</a></li>
                  </ul> -->
                </li>
                <li><a href="">Profiles</a>
                  <ul>
                    <li><a href="">Sub 1 Item 1</a></li>
                    <li><a href="">Sub 1 Item 2</a>
                      <ul>
                        <li><a href="">Sub 2 Item 1</a></li>
                        <li><a href="">Sub 2 Item 2</a></li>
                        <li><a href="">Sub 2 Item 3</a></li>
                      </ul>
                    </li>
                    <li><a href="">Sub 1 Item 3</a>
                      <ul>
                        <li><a href="">Sub 2 Item 1</a></li>
                        <li><a href="">Sub 2 Item 2</a>
                          <ul>
                            <li><a href="">Sub 3 Item 1</a></li>
                            <li><a href="">Sub 3 Item 2</a></li>
                            <li><a href="">Sub 3 Item 3</a></li>
                          </ul>
                        </li>
                      </ul>
                    </li>
                  </ul>
                </li>
                <li><a href="">Photo Gallery</a>
                 <!-- <ul>
                    <li><a href="">Sub 1 Item 1</a></li>
                    <li><a href="">Sub 1 Item 2</a></li>
                    <li><a href="">Sub 1 Item 3</a></li>
                  </ul> -->
                </li>
                <li><a href="">Alumni</a>
                 <!-- <ul>
                    <li><a href="">Sub 1 Item 1</a></li>
                    <li><a href="">Sub 1 Item 2</a></li>
                    <li><a href="">Sub 1 Item 3</a></li>
                  </ul> -->
                </li>
                <li><a href="">Contact Us</a>
              <!--    <ul>
                    <li><a href="">Sub 1 Item 1</a></li>
                    <li><a href="">Sub 1 Item 2</a></li>
                    <li><a href="">Sub 1 Item 3</a></li>
                  </ul> -->
                </li>
              </ul>
            </nav>
      </div> <!-- End div id="Nav"  -->
      <div id="LayoutDiv2">
      <!-- InstanceBeginEditable name="Vestry-Content" -->                     
             <!--   <script>
                if (Galleria) { $("body").text('Galleria works') }
            </script>-->
    <div class="yoxview">
    <h3>   Photo Gallery</h3>
    <a href="yoxview/Images-Yoxview/Trial_Gallery1.jpg"> <img src="yoxview/Images-Yoxview/Thumbnails/Trial_Gallery_thumb1.jpg"alt="First" width="100" height="97" title="First image" /></a>
        <a href="yoxview/Images-Yoxview/Trial_Gallery2.jpg"><img src="yoxview/Images-Yoxview/Thumbnails/Trial_Gallery_thumb2.jpg"alt="Second" width="100" height="97" title="Second image" /></a>
         <a href="yoxview/Images-Yoxview/Trial_Gallery3.jpg"><img src="yoxview/Images-Yoxview/Thumbnails/Trial_Gallery_thumb3.jpg" alt="Third" width="100" height="97" title="Third Image"/></a>
        <!--<img src="photo1.jpg">
        <img src="photo2.jpg">
        <img src="photo3.jpg">-->
    </div>
    <!--<script>
        Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
    Galleria.run('#galleria');
    </script>-->
    <!-- InstanceEndEditable -->
    </div>
      <!--
      <div id="footer">This is the content for Layout Div Tag "footer"</div> -->
    </div>
    <footer></footer>
    <script type="text/javascript" src="js/jquery.flexnav.min.js"></script>
    <script type="text/javascript">$(".flexnav").flexNav({'animationSpeed': 150});</script>
    </body>
    <!-- InstanceEnd --></html>
    The plug-in works.But i want to increase the height of the div with the class = yoxview.But i couldn't find the such class.Here is the css.
    /* YoxView v2.0 CSS file */
    #yoxview .yoxview_bottom{ bottom: 0; }
    #yoxview .yoxview_right{ float: right; }
    #yoxview .yoxview_left{ float: left; }
    #yoxview_popupWrap
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: none;
        z-index: 100;
    #yoxview
        position: absolute;
        font-family: Arial, Sans-Serif;
        z-index: 999;
        border: solid 1px #999;
        overflow: hidden;
        font-size: 10pt;
        text-align: left;
        max-height: 1000px;
    #yoxview a img, #yoxview_infoPanel a img{ border: none; }
    #yoxview a:focus{ outline: none; }
    #yoxview div.yoxview_imgPanel{ position: absolute; top: 0; left: 0; }
    #yoxview div.yoxview_mediaPanel
        position: absolute;
        background: #191919;
        width: 100%;
        height: 100%
    #yoxview .yoxview_ctlBtn
        position: absolute;
        z-index: 3;
        display: block;
        text-decoration: none;
        outline: none;
        width: 50%;
        height: 100%;
    #yoxview .yoxview_ctlBtn img
        position: absolute;
        border: none;
        top: 50%;
        margin-top: -22px;
    #yoxview a.yoxview_ctlBtn:focus, #yoxview a.yoxview_ctlBtn:active{ outline: none; outline: none;}
    #yoxview .yoxview_notification
        width: 59px;
        height: 59px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -30px;
        margin-left: -30px;
        z-index: 4;
        opacity: 0.6;
        filter: alpha(opacity=60);
        background-image: url(images/sprites.png);
        background-repeat: no-repeat;
        display: none;
    #yoxview #yoxview_ajaxLoader img
        padding: 13px;
    #yoxview .yoxview_popupBarPanel
        position: absolute;
        z-index: 4;
        min-height: 70px;
        width: 100%;
        right: 0;
    #yoxview #yoxview_menuPanel
        width: 145px;
        height: 42px;
        padding-top: 0px;
        padding-right: 9px;
        position: absolute;
        right: 0;
        background: url(images/sprites.png) no-repeat left -77px;
        background: rgba(0, 0, 0, 0.8);
        -moz-border-radius: 0 0 0 15px;
        -webkit-border-radius: 0 0 0 15px;
        border-radius: 0 0 0 15px;
        top: -42px;
    #yoxview #yoxview_menuPanel a
        display: block;
        width: 45px;
        float: right;
        text-align: center;
        font-size: 0.8em;
        position: relative;
        margin-top: -5px;
        padding-bottom: 13px;
        text-decoration: none;
        font-family: Arial, Sans-Serif;
    #yoxview #yoxview_menuPanel a span{ color: White; display: block; margin-bottom: 3px;  }
    #yoxview #yoxview_menuPanel a.last{ margin-left: 0; }
    #yoxview #yoxview_menuPanel a:focus{ outline: none; }
    #yoxview_infoPanel
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 0;
        color: White;
        z-index: 2;
        overflow: hidden;
    #yoxview_infoPanel #yoxview_infoPanelBack
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 1;
        left: 0;
        top: 0;
    #yoxview_infoPanel #yoxview_infoPanelContent
        position: absolute;
        width: 100%;
        z-index: 2;
        top: 0;
        left: 0;
    #yoxview_infoPanel span#yoxview_count
        display: block;
        width: 55px;
        font-size: 0.8em;
        float: left;
        text-align: center;
        padding-top: 8px;
        color: #bbb;
    #yoxview_infoPanel #yoxview_infoText
        margin: 0 55px;
        font-size: 12pt;
        padding: 5px 0;
    #yoxview_infoPanel #yoxview_infoText #yoxview_infoTextDescription
        margin-top: 1em;
        font-size: 10pt;
        padding-bottom: 0.5em;
        max-height: 200px;
        overflow: auto;
        padding-right: 10px;
    #yoxview_infoPanel #yoxview_infoText a, #yoxview .yoxview_error a{ color: #a7d557; text-decoration: none; outline: none; }
    #yoxview_infoPanel #yoxview_infoText a:hover, #yoxview .yoxview_error a:hover{ color: #d5eeaa }
    #yoxview_infoPanel a.yoxviewInfoLink
        display: none;
        opacity: 0.8;
        float: right;
        margin-right: 5px;
        margin-top: 5px;
    #yoxview_infoPanel a.yoxviewInfoLink:hover{ opacity: 1 }
    #yoxview #yoxview_helpPanel
        display: none;
        width: 201px;
        height: 312px;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-top: -171px;
        margin-left: -111px;
        z-index: 5;
        color: White;
        padding: 20px;
        padding-top: 10px;
        cursor: pointer;
    #yoxview #yoxview_helpPanel h1{ font-family: Arial Black, Arial, Sans-Serif; font-size: 1em; }
    #yoxview #yoxview_helpPanel p{ margin-top: 80px; }
    #yoxview #yoxview_helpPanel span#yoxview_closeHelp{ display: block; position: absolute; bottom: 20px; left: 0; text-align: center; width: 100%; }
    #yoxview .yoxview_error
        display: block;
        text-align: center;
        color: White;
        font-family: Arial, Sans-Serif;
        font-size: 14pt;
        top: 41%;
        width: 100%;
        height: 20%;
        position: absolute;
        padding: 10px;
    #yoxview .yoxview_error .errorUrl{ font-size: 10pt; }
    #yoxview .yoxview_top{ top: 0; width: 50%; }
    #yoxview .yoxview_element{ width: 100%; height: 100%; position: absolute;  border: none; background: #333; }
    .yoxview-thumbnails a
        float: left;
        margin: 4px;
        /* For thumbnails opacity: */
        opacity: 0.8;
        filter: alpha(opacity=80);
    .yoxview-thumbnails a:hover
        /* For thumbnails opacity: */
        opacity: 1;
        filter: alpha(opacity=100);
    .yoxview-thumbnails a img
        /* Set white borders around the thumbnails, instead of the browser's default Blue: */
        border: solid 1px #ffffff;
    .yoxview-thumbnails-details{ margin-bottom: 1em; }
    .yoxview-thumbnails-details h2{ margin-bottom: 0; padding: 0; font-size: 1.2em; font-weight: bold;}
    Where i could increase the height of the div?Pls help me.

    http://www.yoxigen.com/yoxview/usage.aspx#installation
    Please visit this link.Here in the first step,they have said to add class=yoxview.I did the same.But i couldn't find it in CSS.I have added these links.
    <script type="text/javascript" src="yoxview/yoxview-init.js">
    </script>
    <script type="text/javascript" src="yoxview/yoxview-nojquery.js"></script>
    <script type="text/javascript">
                $(document).ready(function(){
                    $("#thumbnails").yoxview({
                     backgroundColor: 'Blue',
                     playDelay: 5000
    </script>
    <link href="yoxview/yoxview.css" rel="stylesheet" type="text/css">
    HTML Markup
    <div class="yoxview">
    <h3>  Photo Gallery</h3>
    <a href="yoxview/Images-Yoxview/Trial_Gallery1.jpg"> <img src="yoxview/Images-Yoxview/Thumbnails/Trial_Gallery_thumb1.jpg"alt="First" width="100" height="97" title="First image" /></a>
        <a href="yoxview/Images-Yoxview/Trial_Gallery2.jpg"><img src="yoxview/Images-Yoxview/Thumbnails/Trial_Gallery_thumb2.jpg"alt="Second" width="100" height="97" title="Second image" /></a>
         <a href="yoxview/Images-Yoxview/Trial_Gallery3.jpg"><img src="yoxview/Images-Yoxview/Thumbnails/Trial_Gallery_thumb3.jpg" alt="Third" width="100" height="97" title="Third Image"/></a>
    Please help.

  • In a word press moving photo gallery, the photos are not visible though slide change indicator advances

    http://sedonaharmony.org/
    On the above website there is a photo gallery moving banner at the top of this home page. When I first went on this site I could see the photos properly as they advanced. Then, the blog photos were changed and I could no longer see the photos. The banner on my screen is a complete blank even though the upper right circles indicate that "something" is progressing. When I first open the site I see a momentary flash of the site name graphic then the banner goes blank (white). Thanks for your help

    The script that loads the images doesn't seem to be working in Firefox 3.x versions including Firefox 3.6.23<br />
    The banner loads if JavaScript is disabled, but with JavaScript enabled a script replaces that banner with a slide show that fails to load the images.<br />
    It work in Firefox 4 and the current Firefox 7.0.1 version, so you will have to update if you want to visit that site.

  • Creating a photo gallery like the China Gallery in Adobe Labs. How?

    I have photos in several categories (I'll use 2, "frank" and "wolfie" as examples here). What I'd like to do is build a photo gallery like the China Photo Gallery shown in the Adobe Labs site, where the user can switch between categories without going to a different page. Here's what I've done so far and how I'm stuck:
    I created a photo gallery with the instructions in the tutorial "Building a photo album with the Spry Framwork". I then inserted a Tabbed Panels widget for navigating between the categories.
    I set up an XML file as follows:
    /* frank category */
    <photo
    path = "001p.png"
    width = "467"
    height = "467"
    thumbpath = "001p.png"
    thumbwidth = "85"
    thumbheight = "85">
    </photo>
    /* wolfie category */
    <photo
    path = "001f.png"
    width = "467"
    height = "467"
    thumbpath = "001f.png"
    thumbwidth = "85"
    thumbheight = "85">
    </photo>
    To create the div holding the thumbnails for the "frank" category, I entered the following:
    <div class="thumbdiv" spry:region="dsGallery"><img src="thumbnails/frank/{@thumbpath}" spry:repeat="dsGallery" spry:setrow="dsGallery" class="thumbs" /></div>
    To create the div where the full size images will be displayed, I entered the following:
    <div class="mainpic" spry:detailregion="dsGallery"><img src="images/frank/{@path}" onload="MM_effectAppearFade(this, 1500, 0, 100, false)" /></div>
    Then, in the tabbed panel set for the "wolfie" category, I did the same thing, substituting "wolfie" for "frank". However, since there is only one xml file, spaceholders for all of the thumbnails appear in the thumbnail div for the frank category. I realize that I'll probably need to create a separate xml file for each category, but how do I set it up so the correct xml file is accessed when the link in the tab is clicked? Or am I approaching this all wrong?
    From reviewing the source for the China gallery, it appears that they set up links to different xml files instead of Tabbed Panels. How does that work? There are also some javascript files I can't find anywhere on Adobe's site.
    Thanks

    Hi,
    If you have seperate XML file but with the same basic structure then you can change the XML a Spry dataset refers to and regenerate the spry region without reloading the full page.
    So on my photo gallery page I can change the album the photos are shown from via the seturl sprydata function as below.  dsPhotos being my Spry dataset that points to the relevant XML dataset with my image references and captions etc.  My XML is actually dynamically generated from Picasa RSS feeds (and RSS feeds are XML) but the principle will be the same with your static XML.
    First I add an event listener for when someone clicks on an album (the li tag within my div with the id "albums" holds a photo and title for each album.)
    function Albums()
    var myalbums = Spry.$$("#albums li", "TabbedPanels1")
    var rows = dsAlbums.getData();
    var setListener = function( element, value )
      Spry.Utils.addEventListener( element, "click", function(){ showAlbum( value ); },false );
    for( var i = 0, length = myalbums.length; i < length; i++ )
      setListener( myalbums[i], i );
    Then this is the code which changes the photo album to be shown. (when the user clicks the relevant album)
    function showAlbum(i)
    pauseShow();
    pImage = 'No';
    var rows = dsAlbums.getData();
    var albumid = rows[i]["albumid"];
    var url = "xml/PicasaAphotoFeed.asp?albumid=" + albumid;
    dsPhotos.setURL(url);
    dsPhotos.loadData();
    var rowcount = dsAlbums.getRowCount() - 1;
    var nextalbum;
    var navnext;
    var n;
    The page is here www.thehmc.co.uk/photo5.html is you want to see it in context.
    In your case showAlbum would switch between Frank.xml or Wolfie.xml depending on how you decide to name your xml datasets.
    Regards
    Phil

  • Photo Gallery using Bridge CS4 - trying to follow instructions, but no luck

    I'm running Photoshop CS4 Extended, and am trying to figure out how to create a Photo Gallery.
    Adobe instructions for using Bridge to create a photo gallery say this:
    Adobe Output Module provides a variety of templates for your gallery, which you can select using the Output panel. Each template has one or more style options, which you can select and customize to suit your needs.
    Important: Though gallery previews display a maximum of 10 files, your complete gallery will appear when you save or upload it.
    Select the files or the collection or folder that contains the images you want to include in the web gallery.
    Choose Window > Workspace > Output.
    If the Output workspace is not listed, select Adobe Output Module in Startup Scripts preferences.
    PROBLEMS:
    (1)In Bridge, there is no such item as Output under Window > Workspace.
    (2)In Photoshop, there is no such item as "Startup Scripts" in Edit  > Preferences.
    (3)In the Adobe CS4 Sample Scripts/JavaScript directory, there is no such item as Adobe Output Module.
    There must be some other secret that the instructions forgot to mention... but what IS it???

    Finally noticed I was running Bridge CS3 --- my old shortcut apparently still pointed to that version, even though I do have CS4 installed.
    When I launch Bridge from within Photoshop, version CS4 does come up.
    Will now go explore further, using the proper release...

  • Photo Gallery Template customisation

    I would like to look creating specialised template to use in the Adobe Bridge photo Gallery output module.  Problem is I cant find where the current templates are stored so I can have a look at what is required to change them so I can create the revised template.  I have found a reference to the templated being in a folder in the Photoshop installation called presets but as that folder doesn't exist on my CS5 installation I suspect it was for an earlier version.  Can anyone advise where I can find the files used for the current HTML template listed in the Template section of the Photo Gallery module.  And has anyone attempted a rebuild of the code to create a new template?
    It may of course not be possible but if it is written in javascript then it is at least worth considering.
    Les

    Thanks Curt, In fact I think I have found the files under
    user\Application Data\Adobe\Bridge CS5\Adobe Output Module\MediaGallery\
    I got there as a result of your suggestion and although I didn't find /roaming/ I did find the following directories
    /document1/
    /preview/
    /previewinbrowser1/
    So I am guessing these contain the files I need to work with.  Some of the files are json files which is a bit new to me but I think there is a fair bit of resource around about it.
    Regards, Les

  • Photo gallery page from iWeb '08 doesn't work for Mac OS X 10.3.9 user?

    I have recently published a photo gallery page with comments on using iWeb '08 (latest update). Displays fine for me and apparently a lot of other mixed-platform users. But one user is saying that his eMac with Mac OS X 10.3.9 and the Safari of the day don't display the pictures. He gets the banner and background image for the gallery, but not the actual pictures. I asked him to try Firefox, but so far no reply on that.
    Do the older versions of Safari work with content from iWeb '08?

    QuickTimeKirk wrote:
    The only thing missing when viewed using older browsers is those features that require newer Web browser software.
    It was no different when AOL went from version 3 to version 4.
    The very complex javascript files written by iWeb 2 still allow older browsers view (limited features) view the basic parts of your pages.
    Unfortunately this is not true. On an iMac G4 10.3.9 using Safari you cannot even view the photos, the photo page or even the web gallery itself. You just get a warning. Had I known that my friends and family would have a problem viewing photos I would have passed on the update. I don't expect my Father to upgrade his system to view photos from the "user friendly" Apple programs. That's why we got him an iMac to begin with. I find iLife 08 a very poor release from Apple and more trouble than it is worth.
    It was no different when AOL went from version 3 to version 4.
    I didn't know AOL even still existed, that alone upgraded!? (haha)
    +The images should load but many of the Web 2.0 features will not work (image rollover viewing, changing dimensions or background colors).+
    But Kirk, they don't, none of them! and this kind of stuff just seems crazy to some of us. I wish that Apple would TELL US or advertise the facts like, Oh, you only get ONE gallery for each user on Web Gallery (useless) and Oh, you will not be able to edit 06 iWeb pages with 08 iWeb and the iLife 08 version of iPhoto you will not be able to view these galleries without upgrading to the latest Safari web browser. Yes we always expect some bugs with a major update but this is getting ridiculous.
    I have not yet had anybody try downloading the newest version of Firefox that will work with 10.3.9. Do you know if that will make a difference? Thanks for your help.

Maybe you are looking for

  • Cannot see HP Laserjet 4600dn on network

    I bought this printer used with none of the install discs. I am using a Mac with OSX 10.7. My Wireless router is a Verison 704WTG. The Lan cable is plugged into port 1 and I have green lights on both the router and the network card. I have downloaded

  • How to deploy jar file in WLS using ant script

    Hi, Im trying to deploy a jar file in weblogic 10.3 using ant script and am running into the below error. +[wldeploy] weblogic.management.DeploymentException: [J2EE:160177]The application at "/u01//RSJBObjects.jar" was not recognized as a valid appli

  • OAS 4.0.8+8i on NT

    We are recently testing a cartridge that runs OK on 3.0.1, on 4.0.8 in order to gain some speed. This is a CWEB cartridge. OAS is under priority scheduling (default). We do seem to get a 30K blob faster than on 3.0.1, but every 20 or so queries (same

  • Snow Leopard language question

    Hi I have a Macbook with Leopard in english, I bought Snow Leopard in the Mexico online Apple Store because I live in the border and it was easier for me, and my order says MAC OS X 10.6 SNOW LEOPARD RETAIL-SPA, my question is, am I gonna have Snow L

  • Oracle manufacturing

    Iam a new entry to 11i apps(mfg).I had the following queries: 1.What is the hardware/software requirement for 11i mfg. 2.How integrated are the modules? Can an industry install module wise instead of all. 3.How many users can login concurrantly?and w