How can I trigger a slideshow lightbox with a single image using Dreamweaver?

I'm currently building a page for a cosmetics company in which clicking a color swatch opens a lightbox-style shots of model slide show using this color makeup. Each sample must trigger a slide show. I use Dreamweaver (CS6), and I'm sure that there must be an easy way to do it, but I didn't think about her again. (It would be a snap in Flash, but alas, the site needs to work on a wide range of devices).

I appreciate any ideas and please do your easy to follow instuction if possible - pretend you speak of a dog or an eighty-six-year-old - because I am not as much experience that I must be. Probably not.

Thanks in advance for any advice.

best,

Wendy

DW does not for you.

Download the Fancybox jQuery plugin.

See this primer for using jQuery Plugins

http://ALT-Web.blogspot.com/2012/11/Primer-for-using-jQuery-plug-ins.html

Nancy O.

Tags: Dreamweaver

Similar Questions

  • How can I insert a slideshow widget on a page based on Dreamweaver templates

    HI, I have a question that has been nagging me for the last three hours.

    I tried to insert a slideshow into a model document by using the Insert widget feature in Dreamweaver CS 5.5.  The problem is that I contine to get the error that

    "This widget requires a code that must be inserted in the header of the current document.  Insertion does not because the head of this document is read-only. »

    I tried to modify the model to make the head tag into an editable region.  I tried to solve the problem by eliminating the

    <!-#BeginEditable "doctitle"-> function call and instead use the <!-InstanceBeginEditable name = "head"->

    function, but all that is grey on all the code on the page that follows this function call.  Another side effect of using this method is that the documents of the child do not even have a header over.

    I don't know if it's just a lack of understanding of how this works, or if there is a bug in Dreamweaver.

    Any help on this would be appreciated.

    The original HTML for the model in question is lower.

    Header 1
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

    <html>

    <head>

    <!-- #BeginEditable "doctitle" --> 

    <title>Priental Solar, Solar, Photovoltaik, PV Anlagen</title>

    <!-- #EndEditable --> 

    <META NAME="Title" CONTENT="Priental Solar, Solar, Photovoltaik, PV Anlagen</">

    <META NAME="Author" CONTENT="Priental Solar, Solar, Photovoltaik, PV Anlagen">

    <META NAME="Publisher" CONTENT="Priental Solar, Solar, Photovoltaik, PV Anlagen">

    <META NAME="Copyright" CONTENT="printEFFECTS  GbR 2011">

    <META NAME="Revisit" CONTENT="After 14 days">

    <META NAME="Keywords" CONTENT="Sonnenenergie, Solar, Photovoltaik, Photovoltaik energie, solarmodul, solarmodule, solaranlagen, solarenergie, solaranlage, pv anlage, erneuerbare energie, pv anlagen, solarenergie photovoltaik">

    <meta name="abstract" content="Sonnenenergie, Solar, Photovoltaik, Photovoltaik energie, solarmodul, solarmodule, solaranlagen, solarenergie, solaranlage, pv anlage, erneuerbare energie, pv anlagen, solarenergie photovoltaik">

    <META NAME="Description" CONTENT="Hier können Sie kostenlos ein Angebot für eine PV Anlage (Photovoltaikanlage) anfordern. Priental Solar ist Ihr Partner für Planung und Installation von Photovoltaikanlagen">

    <META NAME="Abstract" CONTENT="Priental Energiesysteme & Priental Solar, Solar, Photovoltaik, PV Anlagen</">

    <meta name="classification" content="Priental Energiesysteme & Priental Solar, Solar, Photovoltaik, PV Anlagen">

    <META NAME="audience" CONTENT=" Alle ">

    <META NAME="Robots" CONTENT="INDEX,FOLLOW">

    <META NAME="Language" CONTENT="Deutsch">

    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">

    <link rel="stylesheet" href="../style.css" type="text/css">

    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

    </head>

    <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

    <div class="back"> 

      <table width="100%" border="0" cellspacing="0" cellpadding="0">

        <tr> 

          <td height="100%" align="center"> 

            <table width="900" border="0" cellspacing="0" cellpadding="0" height="10">

              <tr> 

                <td height="10"></td>

              </tr>

            </table>

            <table width="900" border="0" cellspacing="0" cellpadding="0" height="142">

              <tr> 

                <td> 

                  <table width="900" border="0" cellspacing="0" cellpadding="0" height="142">

                    <tr> 

                      <td width="645"><a href="../index.html"><img src="../images/top-1-2_01.jpg" width="645" height="142" border="0"></a></td>

                      <td width="255" background="../images/top-1-2_02.jpg"> </td>

                    </tr>

                  </table>

                </td>

              </tr>

            </table>

            <table width="900" border="0" cellspacing="0" cellpadding="5" height="20" bgcolor="#CCCCCC">

              <tr> 

                <td bgcolor="#003366"> 

                  <div align="right">   <a href="../kont_schreiben.php" class="linkGrey">Kontakt</a>     <span class="linkGrey">|</span>     <a href="../anfahrt.htm" class="linkGrey">Anfahrt</a>    <span class="linkGrey">|</span>     <a href="../Impressum.htm" class="linkGrey">Impressum</a>    </div>

                </td>

              </tr>

            </table>

            <table width="900" border="0" cellspacing="0" cellpadding="5" height="3" bgcolor="#99CC33">

              <tr> 

                <td bgcolor="#99CC33"> </td>

              </tr>

            </table>

            <table width="900" border="0" cellspacing="0" cellpadding="0" height="450">

              <tr> 

                <td valign="top"> 

                  <table width="900" border="0" cellspacing="0" cellpadding="3">

                    <tr> 

                      <td valign="top" width="180" bgcolor="#99CCCC"> 

                        <table width="180" border="0" cellpadding="10">

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../index.html" class="linkmmenu2">Startseite</a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../Solaranlagen.htm" class="linkmmenu2">Solaranlagen</a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../BHKW.htm" class="linkmmenu2">BHKW</a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../heimkraftwerk.htm" class="linkGrey"><span class="linkmmenu2">Priental Heimkraftwerk</span></a></div>

                            </td>

                          </tr>
                          
                           <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../FAQ.html" class="linkGrey"><span class="linkmmenu2">Heimkraftwerk FAQ</span></a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../Brandsicherung.htm" class="linkmmenu2">Brandsicherung</a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../Solar-Lexikon.htm" class="linkmmenu2">Solarlexikon</a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../Team.htm" class="linkmmenu2">&Uuml;ber 

                                uns / Team</a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../1_Referenzen4_70KwP.htm" class="linkmmenu2">Referenzen</a></div>

                            </td>

                          </tr>

                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../newsletter_anm.php" class="linkmmenu2">Anmeldung News</a></div>

                            </td>

                          </tr>
                          
                          <tr> 

                            <td bgcolor="99CC33"> 

                              <div align="left"><a href="../pdf/empfehlung_heimkraftwerk.pdf" target="_new" class="linkmmenu2">Empfehlungen</a></div>

                            </td>

                          </tr>

                        </table>

                      </td>

                      <td width="20" bgcolor="#99CCCC"> </td>

                      <td valign="top" width="660" align="left" bgcolor="#FFFFFF"> 

                        <table width="660" border="0" cellspacing="8" cellpadding="0" height="450" bordercolor="#999933" bgcolor="#F0F8FB" align="left">

                          <tr> 

                            <td align="left"><!-- #BeginEditable "content" -->{content}<!-- #EndEditable --></td>

                          </tr>

                        </table>

                      </td>

                    </tr>

                  </table>

                </td>

              </tr>

            </table>

            <table width="900" border="0" cellspacing="0" cellpadding="5" height="25" bgcolor="#003366">

              <tr> 

                <td height="10" align="left">     <span class="txtBottomSm">BERATUNG 

                  | PLANUNG | KOMPLETTSERVICE</span></td>

              </tr>

            </table>

            <table width="900" border="0" cellspacing="0" cellpadding="0" height="60" bgcolor="99CC33">

              <tr> 

                <td height="10"> 

                  <table width="860" border="0" cellspacing="0" cellpadding="20">

                    <tr> 

                      <td align="left"><!-- #BeginEditable "bottom" -->{bottom}<!-- #EndEditable --></td>

                    </tr>

                  </table>

                </td>

              </tr>

            </table>

          </td>

        </tr>

      </table>

    </div>

    </body>

    </html>

    Build a model (not models) page.  Insert the widget there.  Copy the links/js from the head of this dummy page and manually paste in the edit box in the head of the page you want.

    The problem is that the code of the widget is not smart enough to find the editable area of the model in the head as a destination and try to write code in a non-editable region.  Give him a little help with this manual procedure.

  • How can I replace the big picture with the poplet image and add an internal focus on the big picture?

    I need to replace the enlarged image with poplet image when you click on & also need a zoom internal on the big picture. It doesn't seem to be a simple way to do this. Js is available for this please?

    Just drag brett [at] prettydigital.com email Glenn.

    I think that your after...

    -Wide product displayed by default, click left and right you have a cursor of all images of poplet

    -Hover over the big picture without clicking, it's a zoom of the image or (which I think would be better) you click that or one of the poplet images and you have a model coming with a larger image.

  • How can I create a slideshow (mixed) with a hover which triggers the previous frame or next?

    I want to create a slideshow of images to bicycle at random on autoplay, with a stationary flight that would manually determine an image change in this slide show.

    Is this feasible? Advice or tips would be greatly appreciated. Thank you very much!

    Hello

    With slide show, we cannot install effect hover for the passage of the image, but you can use the composition.

    Composition used triggers and Setup see the target on bearing and place the triggers just under the target window so that when users hover over them thumbnail images will automatically change.

    Thank you

    Sanjit

  • How can I view a pdf file with a single page first, then of two continuous pages?

    can someone please help?

    I am trying to view a pdf of the 8 page, as it will be printed.

    1st view = cover page

    2nd view = 2 and 3

    3rd = 4 and 5

    view 4 = 6 and 7

    View 5 = back

    Thanks in advance

    Check "See the cover Page during two" under display - display of the Page.

  • How to ftp pages everything has changed with a single command in Dreamweaver

    I can't find a command in Dreamweaver cc of ftp of all pages at the same time.  I'm sending them individually, and it seems that there is probably a better way.

    Hi taishoku,.

    Go to the Asynchronous transfer section in this article FTP of Dreamweaver CS6 improvements: Adobe Dreamweaver Team Blog. The same characteristic applies to Dreamweaver CC.

    Thank you

    Preran

  • How can I trigger an onchange for an item never displayed or hidden event

    Hello - I have a question that I don't want not displayed on my page - more information that the user wants or needs; Let's call him B. It must be
    defined by an event onchange of an visible element (A); Then, the change of triggers B on onchange to set another article (visible) - C.

    When B is visible on the page, it all works. If I hidden or conditionally never displayed, it does not. From the looks of
    He, B never gets changed.

    How can I trigger this event onchange (from B to C value) with no visible B?

    Thank you
    Carol

    Carol:

    Exactly how you set the value of B in the 'onchange' for A Manager?
    If you all work when B is not a hidden item, you should be able to define B as a text box, then use the 'visibility' CSS attribute to hide the loading of the page.

    $x('B').style.visibility = "hidden".

    CITY

  • How can I find the music marked with an exclamation point in my itunes library?

    How can I find the music marked with an exclamation point in my itunes library?

    Hello there rdgernnr!

    I certainly don't want to find the songs that show the "!" and get them to play correctly. If you have not yet done it, read this article: If you see an exclamation point next to your items in iTunes - Apple Support

    More precisely:

    Correct the path of the media file

    Follow these steps to help find the correct location of the file iTunes media:

    1. In iTunes on your Mac or PC, select the song, album, movie, or television show that has the exclamation next to him.
    2. In the MenuBar at the top of your screen, computer or at the top of the iTunes window choose Edition > read the information.
      If you are using Windows and you don't see the menu bar, Learn how to turn it on.
    3. When you see a message asking if you want to locate the file, click search.
      • If you know the location of the file, point to it iTunes and try to read your content.

      • If you do not know the location of the file, search for it:
        Mac: Press ⌘ and space control your keyboard, and then type the name of the movie title, app, song, album or artist.
        Windows: Press the Windows on your keyboard, and then type the name of the movie title, app, song, album or artist. If your keyboard does not have a Windows key, press the Escape (Esc) and control (Ctrl) on your keyboard.

      • If the file is on a network drive or external, plug on the volume of disk or external network.

      • If you find your objects in the trash or recycle bin, restore them to their previous location:
        Mac: Control-click or right-click on the item and choose put back.
        Windows: Right-click on the item and choose restore.
    4. Once you retrieve the file, use Get new Info to locate the file, and then point iTunes to the correct location.

    See you soon!

  • How can I make Thunderbird start car with windows startup

    How can I make Thunderbird start car with windows startup

    You can by placing a shortcut in the startup folder of windows, just like any other windows program.

    However if you do, you are likely to encounter problems such as downloading email while still load the antivirus and the network is busy, announcing the arrival of machines on the network (which can be a network a) and any other program of a dozen are loading is heavy risk of timeouts and disconnections of the server as well as error messages that make little sense because they are something that still load.

    The bottom line is so safe that you can, but if there are any questions bring her out of there first.

  • Credit card was stolen. How can I pay for storage iCloud with Tunes gift card?

    Credit card was stolen. How can I pay for storage iCloud with Tunes gift card?

    Buy the card normally and wait for it to be loaded.

    (139690)

  • How can I synchronize my macbook air with my apple tv

    How can I synchronize my macbook air with my apple tv?

    Just what do you mean by sync?

    What model of MacBook Air?

    What model Apple TV?

    Maybe this will help you

    To view a video from your Mac to a TV high definition - Support Apple AirPlay

    http://support.Apple.com/kb/HT4437

  • On Mac Book Pro, how can I select and delete spam with it opening?

    On Mac Book Pro, how can I select and delete spam with on their opening?

    Go to the junk mail folder in the Mail sidebar. Place the cursor in the message window and press command + A to select all of the messages in the window. Click on the trash in the toolbar or CTRL - RIGHT click and select the Recycle Bin on the shortcut menu.

  • How can I get headphones to work with phone I6

    How can I get headphones to work with phone I6

    Too bad.  I had to remove the cover of the phone to get a connection with the headset.

  • How can I burn a slideshow I made in Iphoto on a DVD?  I recorded on my desk and have a DVD player in my mac.

    How can I burn a slideshow I made in Iphoto on a DVD? I recorded it on my desk and it is in Iphoto.

    Export to the desktop then right click on the exported sequence and select burn to disc

    LN

  • How can I sync my iphone contacts with outlook 2016 6 more?

    How can I sync my iPhone contacts with outlook 2016 6 more?

    Hello Ronusmc,

    I understand that you want to synchronize your contacts with Outlook 2016. It's something I can help you with.

    If you are wanting to use traditional synchronization, then I would start by using the first link below. It will guide you through connecting your iPhone to your computer and looking at the different content tabs sync back. For your more precisely, you can the Info tab because this is where the contact synchronization options.

    Sync your iPhone, iPad or iPod touch with iTunes via USB
    https://support.Apple.com/en-us/HT201253

    If you use iCloud, then you want to get the iCloud for Windows app. This will set up your sync for you without having to actually plug your iPhone to your computer. Take a look at the article following if you do not want to do.

    Download iCloud for Windows
    https://support.Apple.com/en-us/HT204283

    Take care

Maybe you are looking for

  • search string and convert whole real or 8-bit 32 bit

    I was hoping to get some advice on how I could search for the following string and convert it to a real number or an integer.  The following data is output as a device ascii characters and I would look for both in each line (starting with 7699,72 sec

  • best combination of loops?

    Hi, I am currently working on a labview program that moves a XY stage and then information acquired on the optical spectra for every point, I have made the program for the XY stage and the program to recover data of OSA, but am not sure that the best

  • Horizontal management; Animation of land

    Hey,. I'm not sure if I came across an error within the blackberry platform or not, but this is the situation. I have a CustomManager that contains 25 fields with a horizontal scrolling. Scrolling of the field is great and all the fields appear. Howe

  • Which format is the best one?

    Can you help me with the different methods that can be used to transfer data from the server to the BlackBerry device and what should be the appropriate format of the server response. As it is better to use XML or HTML or txt, or do you think that an

  • Maximum "user accounts" on ACS 5.1

    Is there a maximum number of IDs 'user account' to manage the local database to an ACS 5.1? Thank you...