Spry effect "slide" won't reappear

Hello DW users, I recently made and uploaded a simple HTML
page to test out spry effects on text and images. If you view the
page at
http://student.santarosa.edu/~dnorth/hmwk1.html
you can see what I'm talking about. Everything works fine except
for the "slide" effect. It is set to toggle in its dialogue box,
but doesn't work like i expected it to. When you click on it, it
slides away and disappears. When I click back in the same area, it
doesn't reappear as I expected it to. I can only get it to come
back if I hit the page refresh button. any suggestions?? Thanks,
Deborah North

Just so you'll know, it never makes sense to remove a valid
and complete
doctype.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"dnorth" <[email protected]> wrote in
message
news:fne0qe$kqn$[email protected]..
> Hi Teresa, thanks for the info. I've been working on it
and I got the
> slide
> effect to work only while linking it from a text link,
not directly from
> the
> image itself. It still has problems as you can see if
you go back to the
> link.
> I'm wondering if the slide effect has some bugs to make
it work in this
> manner.
> Maybe I need a hack. I tried removing the Doc Type as
you suggested, but
> that
> still didn't fix things. Who knows. I really appreciate
your time and
> suggestions on this problem. Please go back to the page
and hit refresh if
> you
> have the time.
http://student.santarosa.edu/~dnorth/hmwk1.html
>
> Thanks again, Deborah
>

Similar Messages

  • Spry.Effect.Slide - cannot set initial state.

    I have 3 div elements using the Spry.Effect.Slide effect. I
    use CSS to close 2 elements and leave 1 element open. It works fine
    in Firefox. But in IE7 when the hidden elements slide down to show,
    its still display of none!! In firefox, the elements are displayed
    fine when the slide effect is started. Below is my code.
    Is there another simple approach that will work in IE7?
    <style>
    #menuGroupAboutCompany { display:none; }
    #menuGroupAboutProducts {}
    #menuGroupMoreMatchpoint { display:none; }
    </style>
    <script type="text/javascript">
    var menuGroupAboutCompany_toggle = new
    Spry.Effect.Slide('menuGroupAboutCompany', {duration:500, from:
    '0%', to: '100%', toggle:true,
    setup:menuGroupInit('menuGroupAboutCompany') });
    var menuGroupAboutProducts_toggle = new
    Spry.Effect.Slide('menuGroupAboutProducts', {duration:500,
    toggle:true});
    var menuGroupMoreMatchpoint_toggle = new
    Spry.Effect.Slide('menuGroupMoreMatchpoint', {duration:500, from:
    '0%', to: '100%', toggle:true, setup:menuGroupInit});
    </script>

    Sorry, previous code posting had some other code I was
    experimenting with. This is the current code that works in Firefox.
    <style>
    #menuGroupAboutCompany { display:none; }
    #menuGroupAboutProducts {}
    #menuGroupMoreMatchpoint { display:none; }
    </style>
    <script type="text/javascript">
    var menuGroupAboutCompany_toggle = new
    Spry.Effect.Slide('menuGroupAboutCompany', {duration:500, from:
    '0%', to: '100%', toggle:true});
    var menuGroupAboutProducts_toggle = new
    Spry.Effect.Slide('menuGroupAboutProducts', {duration:500,
    toggle:true});
    var menuGroupMoreMatchpoint_toggle = new
    Spry.Effect.Slide('menuGroupMoreMatchpoint', {duration:500, from:
    '0%', to: '100%', toggle:true});
    </script>

  • IE7 and Spry Effect

    In IE 7 when you start your div with display: none; in order
    to have the slide collapsed at start, when it expands, the text
    inside the div remains hidden, in FireFox the text displays
    properly. Any ideas?

    I just tried V1 Fusions idea and it sort of works, didn't
    have time to play with it more.
    The solution I found, though its still hack and I don't like
    it is to add a second effect to start it off closed:
    so my two effects are:
    var slideClose_effect = new Spry.Effect.Slide("slide1",
    {duration: 1, from: '0%', to: '0%', toggle: false});
    var slide_effect = new Spry.Effect.Slide("slide1", {duration:
    200, from: '0%', to: '100%', toggle: true);
    where slide_effect is triggered on a click of a link
    slideClose_effect is triggered on the page load
    and then I start off the div as visibility = hidden for the
    sliding div. Which works but now there is a blank div that
    collapses on load then works perfectly. I just wish I could start
    out with it collapsed at the get go.
    here are my two effects

  • Spry Effects questions

    I have two (2) questions about using the Spry Effects script in a horizontal slide configuration.
    Question 1:
    In DW CS4 if I add the command <duration: 500,> the numerals turn red.  I also get an error in line ???? from DW which is the line the variable is on.  If I go ahead and accept the change I see the desired quicker slide in Firefox and Safari.  The default is 1,000 milliseconds so I am cutting it in half.  But!  In Internet Explorer 7 the script locks the browser window up.  Even if I revert to the saved HTML and JS files the problem still persists.  This problem also occurs if I set the duration higher than 1,000 milliseconds.
    This also happens if I upload the files to the Internet.  I was forced to redo the line in question and copy my saved SpryEffects.js over to my working directory.  This unlocked the file in Internet Explorer 7.  Any suggestions on how to get the quicker response time in Internet Explorer 7?
    Question 2:
    In Firefox I get a border around the button that enacts the Spry Effect.  I set the text decoration to "none" for both of the IDs for the images.  This thin line does not appear in Internet Explorer 7 or Safari 4.0.3.  My version of Firefox is version 3.5.3.
    The file can be viewed here.
    Thank you in advance.

    I have also found that the Spry works better in FireFox than
    IE7, when it comes to video
    http://www.catholicmemphis.com/catholicmensconference.html
    Check out this page and you will see that the Spry tabbed
    menu stops the video in FireFox but not in Explorer. I have seen
    this type of problem in a few forums, but know one gives an answer
    to those looking for solutions....

  • Doable? Setting Spry Effects to trigger one after the next ala timeline?

    I've got a series of four slide effects. Each one controls another div. Simple enough. Problem is at this time they're all happening at the same time. I want it where once the first div slides into place, then the second div slides into place and so on. So there has to be a delay or something so the slide effects habe staggered starts. Is this doable in Spry? I've seen some examples but they seem to come off ars rather complex.

    Nope. That's not the answer. For starters, I pasted in your code and it came back with syntax errors. so I changed it to this:
    <script type="text/javascript">
        var showContent1 = new Spry.Effect.Fade('ms1',{duration: 1000,from: 0, to: 100, toggle: true, finish:new Spry.Effect.Fade('ms2',{duration: 1000,from: 0, to: 100, toggle: true, finish:new Spry.Effect.Fade('ms3',{duration: 1000,from: 0, to: 100, toggle: true, finish:new Spry.Effect.Fade('ms4',{duration: 1000,from: 0, to: 100, toggle: true})})})});
    </script>
    Which brought up no syntax errors, so I uploaded it and the first effect happens just fine but then it tries to trigger the second effect and instead I get a window prompt in Firefox like this:
    Spry.Effect ERR: Spry.Effect.Animator.prototype.stop: finish callback: Type Error: self.options.finish is not a function
    So I guess they don't consider the finish:new I added a function? Don't get it.

  • Help needed with spry image slide show

    Im new to dw and am currently building a site for my buisness.  I installed a spry image slide show and it works fine in live view but when I view it on the web
    it was looking for sever .js files. I then checked out the spry forums and noticed that it seems to be a common problem. I tried removing the ui1.7 file from the server and reloading,tried removing from local and remote and reloading, tried to change the line <script.src=spry-ui-1.7 etc. to the adobe site as per gramps advise to another having the same issue.  Now when I view on the web the slideshow wheel keeps turning but images donot apear.  Im lost and can use some help, enclosed is my code also sight is www.patsiga.net
    <!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>pats iga supermarket</title>
    <link href="main.css" rel="stylesheet" type="text/css" />
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryDOMUtils.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryDOMEffects.js" type="text/javascript"></script>
    <script src="http://labs.adobe.com/technologies/spry/ui/includes/SpryWidget.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryPanelSelector.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryPanelSet.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryFadingPanels.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SprySliderPanels.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryFilmStrip.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryImageLoader.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/SpryImageSlideShow.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/plugins/ImageSlideShow/SpryThumbnailFilmStripPlugin.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/plugins/ImageSlideShow/SpryTitleSliderPlugin.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/plugins/ImageSlideShow/SpryPanAndZoomPlugin.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    body {
    background-color: #AF692A;
    </style>
    <link href="Spry-UI-1.7/css/ImageSlideShow/basicFS/basic_fs.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    /* BeginOAWidget_Instance_2141543: #frontpageslideshow */
    #frontpageslideshow {
    width: 960px;
    margin: 0px 0px 0px 0px;
    border: solid 0px #aaaaaa;
    background-color: #FFFFFF;
    padding-top: 0px;
    #frontpageslideshow .ISSName {
    top: -24px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 18px;
    text-transform: uppercase;
    color: #AAAAAA;
    #frontpageslideshow .ISSSlideTitle {
    top: -18px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 12px;
    overflow: hidden;
    color: #AAAAAA;
    text-transform: none;
    #frontpageslideshow .ISSClip {
    height: 361px;
    margin: 0 0px 0px 0px;
    border: solid 0px #ffffff;
    background-color: #ffffff;
    #frontpageslideshow .ISSControls {
    top: 0px;
    height: 361px;
    #frontpageslideshow .FilmStrip {
    height: 0px;
    background-color: #CCCCCC;
    #frontpageslideshow .FilmStripPreviousButton, #frontpageslideshow .FilmStripNextButton {
    width: 10px;
    height: 0px;
    #frontpageslideshow .FilmStripTrack {
    height: 0px;
    #frontpageslideshow .FilmStripContainer {
    height: 0px;
    #frontpageslideshow .FilmStripPanel {
    height: 0px;
    padding-left: 10px;
    margin-right: 0px;
    #frontpageslideshow .FilmStripPanel .ISSSlideLink {
    margin-top: 10px;
    border: solid 1px #AAAAAA;
    background-color: #FFFFFF;
    #frontpageslideshow .FilmStripPanel .ISSSlideLinkRight {
    border: solid 1px #AAAAAA;
    width: 56px;
    height: 47px;
    margin: 4px 4px 4px 4px;
    #frontpageslideshow .FilmStripCurrentPanel .ISSSlideLink {
    background-color: #ffffff;
    border-color: #000000;
    #frontpageslideshow .FilmStripCurrentPanel .ISSSlideLinkRight {
    border-color: #AAAAAA;
    /* EndOAWidget_Instance_2141543 */
    </style>
    <script type="text/xml">
    <!--
    <oa:widgets>
      <oa:widget wid="2141543" binding="#frontpageslideshow" />
    </oa:widgets>
    -->
    </script>
    </head>
    <body>
    <div class="container">
      <div class="header"><!-- end .header --><a href="index.html"><img src="images/logoimg.jpg" width="259" height="136" alt="pats_logo" /></a><img src="images/H1180T2.jpg" width="699" height="120" alt="header_graphic" /></div>
      <div class="container">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="weekly_ad.html" title="weekly ad">Weekly ad</a></li>
          <li><a href="recepies.html" title="recepies">Recepies</a></li>
          <li><a href="entertainment.html" title="entertaining" class="MenuBarItemSubmenu">Entertaining</a>
            <ul>
              <li><a href="bakery_brochure.html" title="bakery_brochure">Bakery brochure</a></li>
              <li><a href="deli_platters.html" title="Deli_platters">Deli platters</a></li>
              <li><a href="catering_menu.html" title="Catering_menu">Catering Menu</a></li>
            </ul>
          </li>
          <li><a href="pats_best.html" title="pats best">Pat's Best</a></li>
          <li><a href="organics.html" title="organics">Organics</a></li>
          <li><a href="gift_cards.html" title="gift cards">Gift Cards</a></li>
          <li><a href="#" title="departments" class="MenuBarItemSubmenu">Departments</a>
            <ul>
              <li><a href="meats.html" title="dept_meats">Meats</a></li>
              <li><a href="seafood.html" title="dept_seafood">Seafood</a></li>
              <li><a href="deli.html" title="Dept_deli">Deli</a></li>
              <li><a href="prep_foods.html" title="Dept_prep_foods">Prepared Foods</a></li>
              <li><a href="produce.html" title="dept_produce">Produce</a></li>
              <li><a href="bakery.html" title="Dept_bakery">Bakery</a></li>
            </ul>
          </li>
        </ul>
        <p> </p>
        <ul id="frontpageslideshow" title="">
          <li><a href="images/fall.jpg" title=""><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-1.jpg" alt="photos-1.jpg" /></a></li>
          <li><a href="images/apples.jpg" title=""><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-10.jpg" alt="photos-10.jpg" /></a></li>
          <li><a href="images/pumpkinsoup.jpg" title=""><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-11.jpg" alt="photos-11.jpg" /></a></li>
          <li><a href="images/roast.jpg" title=""><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-12.jpg" alt="photos-12.jpg" /></a></li>
          <li><a href="images/applepie.jpg" title=""><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-13.jpg" alt="photos-13.jpg" /></a></li>
        </ul>
        <script type="text/javascript">
    // BeginOAWidget_Instance_2141543: #frontpageslideshow
    var frontpageslideshow = new Spry.Widget.ImageSlideShow("#frontpageslideshow", {
    widgetID: "frontpageslideshow",
    widgetClass: "BasicSlideShowFS",
    injectionType: "replace",
    autoPlay: true,
    displayInterval: 4500,
    transitionDuration: 2000,
    componentOrder: ["name", "title", "view", "controls", "links"],
    sliceMap: { BasicSlideShowFS: "3slice", ISSSlideLink: "3slice" },
    plugIns: [ Spry.Widget.ImageSlideShow.ThumbnailFilmStripPlugin ],
    TFSP: { pageIncrement: 4, wraparound: true }
    // EndOAWidget_Instance_2141543
        </script>
    <p>Since this is a one-column layout, the .content is not floated. </p>
        <h3>Logo Replacement</h3>
        <p>An image placeholder was used in this layout in the .header where you'll likely want to place  a logo. It is recommended that you remove the placeholder and replace it with your own linked logo. </p>
        <p> Be aware that if you use the Property inspector to navigate to your logo image using the SRC field (instead of removing and replacing the placeholder), you should remove the inline background and display properties. These inline styles are only used to make the logo placeholder show up in browsers for demonstration purposes. </p>
        <p>To remove the inline styles, make sure your CSS Styles panel is set to Current. Select the image, and in the Properties pane of the CSS Styles panel, right click and delete the display and background properties. (Of course, you can always go directly into the code and delete the inline styles from the image or placeholder there.)</p>
      <!-- end .content --></div>
      <div class="footer">
        <p><a href="about_us.html" title="about_us">About Us</a><a href="#">  </a>   <a href="employment.html" title="employment">Employment</a>    <a href="store_info.html" title="store_info"> Store Info.</a>     <a href="#" title="contact_us">Contact Us</a>    <a href="terms_of_use.html" title="terms_of_use">Terms of Use</a>   <a href="privacy.html" title="Privacy_policy"> Privacy Policy</a><br />
    &copy;2011 Pat's IGA     <br />
        </p>
        <!-- end .footer --></div>
      <!-- end .container --></div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>

    Your spry assets folder MUST be in the same folder as that of your webpage with the slideshow (html, php... whatever)
    Check your folder configuration on the server by clicking on the "Remote Button" on the DW Assets Tab.
    Example 1:  This will not work:
    WEBPAGE HERE:    /server/public/myfolder/slideshow.html
    SPRY ASSETS HERE:  /server/public/SpryAssets/....your javascript files
    Example 2: This will work:
    WEB PAGE HERE:  /server/public/myfolder/slideshow.html
    SPRY ASSETS HERE:  /server/public/myfolder/SpryAssets/....your javascript files
    Hope this helps.

  • Problems with the Spry Content Slider Widget in DW6

    Hello there,
    I have been wrestling with a problem I'm having with the Spry Content Slider Widget that I hope someone has an answer for.
    I have 2 widgets on a page, but the problem I'm having occurs whether there is 1 or 2 on the page.
    No matter how many slides I have in the widget, it only shows the first 3. The 2 widgets per page occurs on every html page (9 in total.)
    In there a setting in the inline or linked .js code limiting the number of slides to 3?
    In addition to these widgets, I also use a DWUser_EasyRotator Slider on the pages, and both the easyRotator and Spry Widgets launch a fancyBox jQuery Gallery. Tho it's a possibility, I don't think the mixing of sliders/js is the problem, as I was having the problem with the Spry Widget showing only the first 3 upon the first insert of the Widget.
    Any suggestions on settings I should be aware of, as regards the Widget, would be greatly appreciated… (;

    On line 66 of your code, you have an extra </head> tag that doesn't belong.    Remove that and validate your code again. 
    http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.gallerynumber9.com.au%2Findex ---778.html
    Nancy O.

  • Bought a Quadro K2000 Video Card, After Effects CC Won't detect it?

    I recently bought a Quadro K2000 for some simple 1080p video editing and rendering. Now there comes the problem, It seems like After Effects is not detecting the card, CUDA is enabled and the card is supported in the list. I have tried many solutions but unfortunately I still have this problem. Also with rendering a video my CPU still takes all the load instead of the GPU, therefore it goes really slow, 5 minute render takes up to 2+ hours. I bought this video card so my render also got quicker but it seems like After Effects just won't use the GPU for rendering. I have Ray tracing 3D rendering on.
    Can someone please explain to me why my Quadro K2000 is not used for rendering the videos but instead it still uses my CPU. I hope the $500 was no waste of money for this card.
    Thanks in advance,
    Sjoerd

    You have given us little information to go by. What exact version of After Effects? What operating system. Show a screenshot of your GPU Information dialog box in After Effects.
    The Quadro K2000 was added to the list of cards tested and supported for use by the ray-traced 3D renderer in this version:
    http://blogs.adobe.com/aftereffects/2013/09/after-effects-cc-12-1-whats-new-and-changed.ht ml

  • Spry content slide show

    Hello i'm not great at dreamweaver, my background is more in print, I'm teaching my self dreamweaver.
    how do you change the colors of the buttons in spry content slide show?

    Modify the CSS attributes
    http://forums.adobe.com/thread/691654?tstart=0

  • Spry effects not recognizing classes

    When adding a spry effect to an <img> element, it will pick up on ID's but not classes.
    <style>
    img.color {color:#fffff}
    </style>
    <body>
    <img src="image.jpg" class="img.color" img />
    </body>
    In the spry effect dialogue, it will let me select the current img tag, but if i were to specify a second class
    <style>
    img.color {color:#fffff}
    img.opacity {opacity:50}
    </style>
    <body>
    <img src="image.jpg" class="img.color img.opacity" img />
    </body>
    then it wouldnt work because it can only recognize the current selection instead of the individual styles like i can do with an ID (which wont work for multiple styles as there can be only one id per element).

    It makes it very hard for us to know what you are trying to achieve without seeing some code hence I shall give you some code to work with
    <!DOCTYPE html>
    <html>
    <head>
    <title>Untitled Document</title>
    </head>
    <body>
    <img src="header.jpg" onClick="MM_effectAppearFade(this, 1000, 100, 0, false)">
    <script src="SpryAssets/SpryEffects.js"></script>
    <script>
        function MM_effectAppearFade(targetElement, duration, from, to, toggle)
            {Spry.Effect.DoFade(targetElement, {duration: duration, from: from, to: to, toggle: toggle});}
    </script>
    </body>
    </html>
    Just copy and paste the above code into a new document, make sure that you do have SpryEffects.js in the SpryAssets folder and try it out.
    Gramps

  • BUG report about Spry.Effect.Highlight

    When the Spry.Effect.Highlight effect is not accomplished,
    and click the trigger link, will report the error "startColor
    undefined".

    Can you please elaborate? Which "trigger link" do you mean?
    Are you using the Spry 1.4 release?

  • Problem combining Spry effects with image captions [was: LShub]

    I am using Spry effects combo sample 2. The thumbnails in the sample are all included within the same preview div. I need to include captions underneath the images, so I have each thumbnail and caption within a separate div. The effect still works everywhere except Explorer. In Explorer 7, the image grows behind the image in the next div.
    I read through the Spry for Ajax forum, but the Java Script used there is different. I have tried putting all the divs I want to grow inside another and giving the new div a position and z index. I have also added a z-index in the CSS of the preview div. Nothing I've tried works. Is there a fix?
    Here is a link for the page I am working on:
    http://www.nhci.com/stage/kitchens/countertops.html?tab=kitchens#
    Relevant CSS:
    .thumbs {
        clear: both;
        margin: 5px auto;   
    .thumbnails85 div {
        position: relative;
        width: 85px;
        height: 85px;
        float: left;
        margin: 6px;
        padding: 0;
        float: left;
        display: inline;
    .thumbnails85 img {
        top: 0px;
        left: 0px;
        width: 85px;
        height: 85px;
        position: absolute;
        z-index: 1;
        cursor: pointer;
        -moz-user-select: none;
        -khtml-user-select: none;
    .preview {
        padding: 3px;
        margin-bottom: 5px;
        height: 300px;
        width: auto;
        margin-right: 3px;
        position: absolute;
        float: left;
    .spacer105 {
        height:105px}
    [Subject title edited by moderator]

    I am using Spry effects combo sample 2. The thumbnails in the sample are all included within the same preview div. I need to include captions underneath the images, so I have each thumbnail and caption within a separate div. The effect still works everywhere except Explorer. In Explorer 7, the image grows behind the image in the next div.
    I read through the Spry for Ajax forum, but the Java Script used there is different. I have tried putting all the divs I want to grow inside another and giving the new div a position and z index. I have also added a z-index in the CSS of the preview div. Nothing I've tried works. Is there a fix?
    Here is a link for the page I am working on:
    http://www.nhci.com/stage/kitchens/countertops.html?tab=kitchens#
    Relevant CSS:
    .thumbs {
        clear: both;
        margin: 5px auto;   
    .thumbnails85 div {
        position: relative;
        width: 85px;
        height: 85px;
        float: left;
        margin: 6px;
        padding: 0;
        float: left;
        display: inline;
    .thumbnails85 img {
        top: 0px;
        left: 0px;
        width: 85px;
        height: 85px;
        position: absolute;
        z-index: 1;
        cursor: pointer;
        -moz-user-select: none;
        -khtml-user-select: none;
    .preview {
        padding: 3px;
        margin-bottom: 5px;
        height: 300px;
        width: auto;
        margin-right: 3px;
        position: absolute;
        float: left;
    .spacer105 {
        height:105px}
    [Subject title edited by moderator]

  • Spry static gallery combined with Spry Effect Observers

    I have set up a Spry static gallery using the
    demo
    here.
    I would like to add a cross fade for the main image using the
    Spry Effect Observers shown at the bottom of
    this
    demo page.
    I like the thumbnail grow effect used in the first demo and
    like to add a cross fade for the main image when the thumbnail is
    clicked. Have someone built such an example or can someone show me
    how it is done? Typically I have 4 thumbnails/images per product
    page.

    Mr. Andersson wrote:
    > I thnik I know what's going on now...
    >
    > I tried Fireworks and it has a built in Slideshow
    creator. The setting that
    > dont use Flash uses Spry and looks like the Spry gallery
    demo. The settings
    > using Flash have cross fading images.
    >
    > From this I got the idea that Adobe maybe dont want us
    to cross fade with
    > Spry. They want to push Flash instead. It could explain
    the total silence from
    > Adobe in various threads where this question is asked.
    This is a user to user forum, Adobe will never reply to you.
    Also, Spry is still a pre-release framework, its nowhere near
    finished.
    Its the kind of framework where you take whats available and
    make
    something out of it, its very flexible if you know
    javascript.
    I am learning javascript just to understand the little bits
    that I am
    experimenting with, I think its the only way forward if you
    intend to do
    something outside the box.
    Dooza
    Posting Guidelines
    http://www.adobe.com/support/forums/guidelines.html
    How To Ask Smart Questions
    http://www.catb.org/esr/faqs/smart-questions.html

  • Spry Effects Issue

    Hello everyone,
    I'm new to spry and know very little about ajax and java but
    I'm eager to learn. I downloaded spry frameworks and I'm looking at
    the demo effects page. I click on the fade one and it fades away
    but fades back automatically. How can I set it so it wont fade back
    until it is clicked again?
    Thanks
    -Chris

    var fadename = new Spry.Effect.Fade('idoffade',
    {toggle:true});

  • Spry.Effect.GrowShrink crazy behaviour

    Hi, I was wondering if someone could help me figure out why
    when I pass the mouse over the thumbnails in my photo gallery, they
    act all jumpy. I used the same effect as in the Spry demo photo
    gallery yet they behave differently. My gallery is located here
    http://www.fotosite.ca/temp/index.htm
    my grow function looks like this (and shrink is similar)
    function GrowThumbnail(img, from, to){
    img.style.zIndex = 150;
    img.style.borderStyle = 'solid';
    img.style.borderWidth = '3px';
    img.style.borderColor = '#ffff00';
    Spry.Effect.GrowShrink(img, {duration: 500, from: from, to:
    to ,toggle:false });
    Thanks in advance for any help,

    Hi,
    I see 2 problems:
    1. The Grow/Shrink effect do not know to consider the margin,
    border and padding so when you add these properties from the
    JavaScript you'll have the weird behavior of images moving down and
    right before animation start and then up and left when the mouse
    leave.
    We automatically include the 1px border in the thumbnail view
    and we only change its color. You remove 2px from the border while
    the mouse is not over the element and when you add them the effect
    is really visible and disturbing. If you consider in keeping a such
    big value for the border then you should keep it when the images
    are not focused.
    2. While you move the mouse over the thumbnails fast some of
    the images will remain open. This is a bug that also reproduce in
    our photo gallery too and I will look to fix it while the new Spry
    will be released. The issue is basically generated by the fact you
    are not using the toggle option while running the effect.
    Cristian

Maybe you are looking for