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

Similar Messages

  • Spry content slide show shadow

    Hello, how do you  take of the shadow the the spry content slideshow widget?

    To remove them, open your SlideShow.css file and delete all box-shadow properties from your code:
    -moz-box-shadow: 5px 5px 10px gray;
    -webkit-box-shadow: 5px 5px 10px gray;
    box-shadow: 5px 5px 10px gray;
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb

  • Spry Wonderlust Content Slide show

    Can someone clarify if it is possible  to change the text of the slide/panel buttons/links numbered 1-4 on the Wonderlust content slide show. Any  knowledge and help is appreciated. Many thanks.
    reference link: http://labs.adobe.com/technologies/spry/ui/samples/ContentSlideShowWLB .html

    This will require some JS. The 2 lines of code in SpryContentSlideShow.js starting at line 417 is as follows
    for (var j = 0; j < elements.length; j++)
        linksCC.appendChild(this.createButtonElement((j+1)+"", this.slideLinkClass, null, true));
    If you change the second line to read
        linksCC.appendChild(this.createButtonElement(('M')+"", this.slideLinkClass, null, true));
    You will get an 'M' rather than a number.
    Rather than a fixed value we need to translate this into a variable value. We can do that by modifying the two lines to read
                    for (var j = 0; j < elements.length; j++) {
                        var myValue;
                        switch (j)
                        case 0:
                            myValue= 'A';
                            break;
                        case 1:
                            myValue= 'B';
                            break;
                        case 2:
                            myValue= 'C';
                            break;
                        case 3:
                            myValue= 'D';
                            break;
                        default:
                            alert("The JS code in SpryContentSlideShow does not contain a value for this");
                        linksCC.appendChild(this.createButtonElement((myValue)+"", this.slideLinkClass, null, true));
    Be sure to rename the JS file so that it does not cause a confusion with the original.

  • 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.

  • Remove source code names for Spry Content Slides

    I installed the widget Spry Content Slides and then removed it because it extended beyond the main column into a sidebar. Even though the code is gone the labels remain at the top with all the other source code labels. I want to reinstall Spry Content Slides but how do I stop it from flowing into the adjacent column? When I reinstall will I have duplicating labels?
    John

    If the labels still remain on the page, there is a good chance there is some code that was not entirely deleted.  To answer your second question we would need to see the code from your page to see what is going on and how to fix it.

  • Having trouble with spry image slide show

    Im new to dw and i inserted a image slide show into my index.htm file, it works fine when i preview it in dw cs5.5.  When I try it on a web browser I get a dialog box that says that the spry panel selector .js requires spry widget.js and continues thru several other dialog boxes until my website loads only to see my image slideshow as a list.  Im not sure if its in the code or the support files can anyone help?  I would greatly appreciate it if someone can set me on the right path with this, Thank you in advance.
    <!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="Spry-UI-1.7/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: #9D5F16;
    </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: 951px;
        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"><a href="index.html"><img src="images/logoimg.jpg" width="259" height="136" alt="logo" /></a><img src="images/topheader.jpg" width="701" height="136" alt="header_logo" /><!-- end .header --></div>
      <div class="content">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="#">Weekly Ad</a>      </li>
          <li><a href="#">Recepies</a></li>
          <li><a href="#" class="MenuBarItemSubmenu">Entertaining</a>
            <ul>
              <li><a href="#">Bakery Brochure</a></li>
              <li><a href="#">Deli Platters</a></li>
              <li><a href="#">Catering Planner</a></li>
            </ul>
          </li>
          <li><a href="#">Pat's Best</a></li>
          <li><a href="#">Organics</a></li>
          <li><a href="#">Gift Cards</a>      </li>
          <li><a href="#" class="MenuBarItemSubmenu">Departments</a>
            <ul>
              <li><a href="#">Meats</a></li>
              <li><a href="#">Deli</a></li>
              <li><a href="#">Prepared Foods</a></li>
              <li><a href="#">Seafood</a></li>
              <li><a href="#">Produce</a></li>
              <li><a href="#">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="fall.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="apples.jpg" /></a></li>
          <li><a href="images/applepie.jpg" title=""><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-11.jpg" alt="applepie.jpg" /></a></li>
          <li><a href="images/pumpkinsoup.jpg" title=""><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-12.jpg" alt="pumpkinsoup.jpg" /></a></li>
          <li><a href="images/roast.jpg" title="r"><img src="http://labs.adobe.com/technologies/spry/ui/images/dbooth/thumbnails/photos-13.jpg" alt="roast.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>
    Since this is a one-column layout, the .content is not floated.
        Logo Replacement
        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.
        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.    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.) <!-- end .content --></div>
      <div class="footer">
        <p>About us  Other Services Employment Contacy us Terms of use Privacy Policy</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.

  • Images loading before spry basic slide show

    I'm using the "Spry Basic Slideshow" widget developed by the Adobe team, version 1.0, as found in the Widget Browser.  It works beautifully.  My only question is that on the iPad [and only on the iPad, the iPhone doesn't exhibit this behaviour!], all the images in the slideshow appear before the slideshow is activated so there is a moment when the images appear under each other and fill the page.  Then the rest of the page loads and all the images disappear and start only showing up as they are meant to in the slideshow area.  Is there any way of preventing this?
    http://www.towerltg.com/indexSlideShow.php
    I've not made any changes to the files as they were initially issued with the exception of making my own control icons for play, pause, previous and next.
    Thanks!

    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.

  • Spry image slide show issues

    when adding this too my site i get the following errors, when it did work locally
    SpryPanelSet.js requires SpryWidget.js!
    SpryFadingPanels.js requires SpryPanelSet.js!
    SpryImageSlideShow.js requires SpryWidget.js!
    SpryPanAndZoomPlugin.js requires SpryImageSlideShow.js!
    Ive reuploaded my sprywidget.js multiple times with "non corrupted" versions and used a few i found online all still get the same error.
    my code goes as follows
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <script src="scripts/jquery.js" type="text/javascript"></script>
    <script src="scripts/twitter_search.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="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/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/SpryWidget.js" type="text/javascript"></script>
    <script src="Spry-UI-1.7/includes/plugins/ImageSlideShow/SpryPanAndZoomPlugin.js" type="text/javascript"></script>
    <style type="text/css">

    SpryPanelSet.js requires SpryWidget.js!SpryFadingPanels.js requires SpryPanelSet.js!
    SpryImageSlideShow.js requires SpryWidget.js!
    SpryPanAndZoomPlugin.js requires SpryImageSlideShow.js!
    The above gives you the loading order for each of the 5 JS files.
    SpryWidget.js
    SpryPanelSet.js
    SpryFadingPanels.js
    SpryImageSlideShow.js
    SpryPanAndZoomPlugin.js
    Gramps

  • SPRY Photo Slide Show

    I too have buillt the "gallery file" from:
    http://www.adobe.com/devnet/dreamweaver/articles/spry_photo_album.html
    The thumbnails will not display when I test the page in
    Dreamweaver. I am currtly running IE7.
    Am I doing something wrong with the XML? I did a validate in
    Dreamweaver and the <div> tags on lime 36 & 37 came up in
    error.

    http://www.txesmedia.com/gallery.htm
    Please don't look too close at the website...I'm like the
    carpenter who pays attention to his own, last.
    A more current site is:
    http://www.hillcountrygolfclassic.com
    Here I'm using Dreamweaver CSS templates and SPRY vertical
    widgets.

  • Issues with Spry image slide-show with filmstrip

    Hi
    I used the widget browser to place a copy of the 'spry image slideshow with filmstrip' widget on to one of my web pages. I now have several issues that I am out of my depth trying to troubleshoot.
    There is a big gap (like excess padding) at the top between the outer frame and the main image frame. I can't see how this has arisen or how to correct it.
    Although narrow formatted images are centered horizontally in the image window, wide formatted images appear at the top of the image window, and i would like them to be either centered or at the bottom of the image window
    The thumbnail images that i created for the filmstrip are tiling rather than appearing as a single centered image which is what i would like.
    I have uploaded my test page to the server and you can see it here:
    http://www.hebrideansheep.org.uk/test_gallery.html
    any and all help gratefully received as i have spent all day trying to sort this out, but as a total amateur I feel like I am drowning.
    Many thanks
    John

    Move
    <link href="Spry-UI-1.7/css/ImageSlideShow/basicFS/basic_fs.css" rel="stylesheet" type="text/css" />
    to just below
    <title>HebWeb: Test gallery</title>
    and above
        <style type="text/css">
    /* BeginOAWidget_Instance_2141543: #HSS2011images */
    #HSS2011images {
        width: 684px;
        margin: 24px 0px 0px 0px;
        border: solid 1px #AAAAAA;
        background-color: #FFFFFF;
        padding-top: 10px;
    The style rules that start with the above, are meant to override the rules in basicFS/basic_fs.css, hence they should come after basicFS/basic_fs.css
    Gramps

  • Spry/Slide Show problems from new host

    Recently I moved my site from TDS to godaddy.  Everything worked well on TDS, now people get 4 error merssages before the site loads through Godaddy.  These are:1) SpryPannelSet.js requires SpryWidget.js! Then 2) SpryFadingPanel.js requires SpryPannelSet.js! Then 3) SpryImageSlideShow.js requires Spry Widget.js! Then 4)  SpryPanAndZoomPlugin.js requires Spry Immage Slide Show.js!  Most of my pages have slide shows downloaded from the widget browser.  When I moved the site, I didn't move the site from TDS, I just loaded the site up from my computer.  Is there something I can do to allow people to get on my index page without having to click these error messages.  My site is www.tailgatershandbook.com.

    SpryWidget.js is corrupt. Try re-uploading and if that does not work try linking to the Adobe JS as per
    <script src="http://labs.adobe.com/technologies/spry/ui/includes/SpryWidget.js"></script>
    Gramps

  • Spry Slide Show-how to use one size photo for large photo and thumbnail?

    Hi all,
    I'm am using Adobe's Spry Slide Show. I can only use one size photo 640x480px for both the large photo and the thumbnail.
    I changed the size of the small thumnail on the html:
                     <li><a href="Photos/TestPhoto640x480.jpg" width="490" height="367"><img src="Photos/TestPhoto640x480.jpg" width="63" height="47" alt="photos-1.jpg" /></a></li>
    The thumbnail looks fine until you hit Live View or Preview in Browser then photo comes in full size and you can only see the upper left hand corner.
    I assume that the java is doing this. But I have no training in Java.
    How can I change the Java Code so the thumbnail comes in at 63x47px?
    Many thanks.

    Wish I could use scaled down versions of the thumbnails-but I can't.
    Why not?
        img.src = info.src;
        img.style.width =  "490px";<!--Large Photo size on internet-changed from info.width + "px"; to "490px";  *********-->
        img.style.height =  "368px";<!--Large Photo size on internet-changed from info.height + "px"; to "368px";  *******-->
    You're shooting yourself in the foot with this.  It's overriding your HTML and CSS  values.
    As an FYI, Adobe Abandoned the Spry framework late last year.
    http://blogs.adobe.com/dreamweaver/2012/08/update-on-adobe-spry-framework-availability.htm l
    You might want to cut your losses right now and switch to something better suited to modern web devices & browsers.
    jQuery Fancybox
    http://fancybox.net/
    20 of the best jQuery Slideshows
    http://vandelaydesign.com/blog/web-development/jquery-slideshow/
    Nancy O.

  • Is it possibe to place a slide show background behind a spry accordion

    i have found a background image transition slideshow on
    http://www.willmaster.com/library/features/background-image-transition-slide-show.php
    i cant get it to work yet - but am hoping to use it in my website
    http://mandyevansartist.com
    and was hoping someone could tell me if it will work or not - or if there is something i need to research for it to be possible ( gramps mentioned an "event listener" to load the javascript after the spry - is this one of those moments)
    kind regards
    mandy evans

    Try the jQuery Accordion instead http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=2174022
    Gramps

  • Spry slide show is choppy..what can I do to fix this.

    Are the spry slide show always so choppy? Do I have too many photos? (5) Here is my site mudroomstudios.com. Please, any advise would be appreciated. Otherwise I'll have to ditch the slides.
    thanks
    ~erin

    Ralph 9430, simplify for us dummies...define device ? ios is a what  ...just a slow step by step explaination if you could..
    Thank you in advance      2-20-2013

Maybe you are looking for