How to get img alt tag and display under image as html?

MalloryMan picture MalloryMan · Oct 14, 2015 · Viewed 7.4k times · Source

I'm currently trying to get the img alt tag from each image on a slideshow and use that as the caption to be displayed below the slide.

Is there any simple way of doing this with javascript and css?

Thank you in advance!

Here's a link to the site: http://www.alison-jackson.co.uk

Here's my written HTML:

Here's the outputted HTML:

<div id="galleryWrapper">

  <div id="slideshowWrapper">
    <div id="slideshow" class="sqs-gallery-design-stacked">

      <div data-slide-url="xhpxqx84l4s2dz1sxvz24un4h9bt5h" data-slide-id="544d38fbe4b0dd27d7036a64" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_199" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="552x666" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fbe4b0dd27d7036a64/1444823277877/03-OBAMA_SMOKING_XMAS_231012_HiRes-1024x682.jpg"
        data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fbe4b0dd27d7036a64/1444823277877/03-OBAMA_SMOKING_XMAS_231012_HiRes-1024x682.jpg" class="slide-photo" style="font-size: 0px; top: 0px; left: 387px; width: 662px; height: 798px; position: relative;"
        alt="Obama Smoking 2012. C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fbe4b0dd27d7036a64/1444823277877/03-OBAMA_SMOKING_XMAS_231012_HiRes-1024x682.jpg?format=1500w" data-image-resolution="1500w">
      </div>

      <div data-slide-url="wte8thrzcfhfe00unh2q75vtzj7n0i" data-slide-id="544d38fce4b0dd27d7036a66" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_201" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="1024x690" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fce4b0dd27d7036a66/1444826067827/04-2002_Marilyn_wank_window_bars-1024x690.jpg"
        data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fce4b0dd27d7036a66/1444826067827/04-2002_Marilyn_wank_window_bars-1024x690.jpg" class="slide-photo" style="font-size: 0px; top: 0px; left: 126px; width: 1185px; height: 798px; position: relative;"
        alt="Marilyn Reclining C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fce4b0dd27d7036a66/1444826067827/04-2002_Marilyn_wank_window_bars-1024x690.jpg?format=2500w" data-image-resolution="2500w">
      </div>

      <div data-slide-url="fl83poim6cqov9t6i4qpg30jp7galt" data-slide-id="544d38fee4b0dd27d7036a70" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_203" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="682x1024" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a70/1444821495137/05-2824_001-Queen-on-looHR-682x1024.jpg"
        data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a70/1444821495137/05-2824_001-Queen-on-looHR-682x1024.jpg" class="slide-photo" style="font-size: 0px; top: 0px; left: 452px; width: 532px; height: 798px; position: relative;"
        alt="Queen on the Loo C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a70/1444821495137/05-2824_001-Queen-on-looHR-682x1024.jpg?format=1500w" data-image-resolution="1500w">
      </div>

      <div data-slide-url="2zrbx5dnwpzuczi0vx7ewgeqa7nhbn" data-slide-id="544d38fee4b0dd27d7036a72" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_205" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="1024x771" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a72/1444821531252/06-BRANGELINAS_ORPHANAGE_HIRES_S-1024x771.jpg"
        data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a72/1444821531252/06-BRANGELINAS_ORPHANAGE_HIRES_S-1024x771.jpg" class="slide-photo" style="font-size: 0px; top: 0px; left: 188px; width: 1060px; height: 799px; position: relative;"
        alt="Brangelinas at the Orphanage C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a72/1444821531252/06-BRANGELINAS_ORPHANAGE_HIRES_S-1024x771.jpg?format=2500w"
        data-image-resolution="2500w">
      </div>

      <div data-slide-url="ibzi4a7wff74lm3vdducwz4zyp1c7w" data-slide-id="544d3901e4b013df5bcd17be" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_207" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="682x1024" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b013df5bcd17be/1444821567803/08-083-Marilyn-Back%2BJFK-682x1024.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b013df5bcd17be/1444821567803/08-083-Marilyn-Back%2BJFK-682x1024.jpg"
        class="slide-photo" style="font-size: 0px; top: 0px; left: 452px; width: 532px; height: 798px; position: relative;" alt="Marilyn and JFK C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b013df5bcd17be/1444821567803/08-083-Marilyn-Back%2BJFK-682x1024.jpg?format=1500w"
        data-image-resolution="1500w">
      </div>

      <div data-slide-url="46f2v80gmwzuxhsvuiqte3a1g87gl0" data-slide-id="544d3901e4b04e8632c63118" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_209" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="1024x682" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b04e8632c63118/1444822864869/09_MG_4915_KANYE_BABY_HEADPHONES_MRes-1024x682.jpg"
        data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b04e8632c63118/1444822864869/09_MG_4915_KANYE_BABY_HEADPHONES_MRes-1024x682.jpg" class="slide-photo" style="font-size: 0px; top: 0px; left: 119px; width: 1199px; height: 798px; position: relative;"
        alt="Kanye and his Baby C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b04e8632c63118/1444822864869/09_MG_4915_KANYE_BABY_HEADPHONES_MRes-1024x682.jpg?format=2500w"
        data-image-resolution="2500w">
      </div>

      <div data-slide-url="y9nvmit9z4fyq553moepomk3dub6ka" data-slide-id="544d3904e4b04e8632c6311a" class="slide sqs-gallery-design-stacked-slide loaded sqs-active-slide" id="yui_3_17_2_1_1444864321837_211" data-type="image" style="opacity: 1; z-index: 889;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="840x571" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3904e4b04e8632c6311a/1444821696436/10-JACKPOOL-1024x681.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3904e4b04e8632c6311a/1444821696436/10-JACKPOOL-1024x681.jpg"
        class="slide-photo" style="font-size: 0px; top: 0px; left: 131px; width: 1174px; height: 798px; position: relative;" alt="Jack Nicholson in the Pool C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3904e4b04e8632c6311a/1444821696436/10-JACKPOOL-1024x681.jpg?format=2500w"
        data-image-resolution="2500w" id="yui_3_17_2_1_1444864321837_497">
      </div>

      <div data-slide-url="0xc0wmfensimmqyqhriwr7f78fh972" data-slide-id="561e3db7e4b0111ed6127992" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_213" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="1000x782" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3db7e4b0111ed6127992/1444823271267/marilyn-undressing-for-jfk.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3db7e4b0111ed6127992/1444823271267/marilyn-undressing-for-jfk.jpg"
        class="slide-photo" style="font-size: 0px; top: 0px; left: 208px; width: 1021px; height: 798px; position: relative;" alt="Marilyn Undressing for JFK C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3db7e4b0111ed6127992/1444823271267/marilyn-undressing-for-jfk.jpg?format=2500w"
        data-image-resolution="2500w">
      </div>

      <div data-slide-url="xemwpiezb8gnz59ozhblaal2yg8q5z" data-slide-id="561e3dc8e4b0111ed61279d1" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_215" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="3179x4308" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3dc8e4b0111ed61279d1/1444823271253/7+-+36+-+Breasts+-+Sepia_LoRes.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3dc8e4b0111ed61279d1/1444823271253/7+-+36+-+Breasts+-+Sepia_LoRes.jpg"
        class="slide-photo" style="font-size: 0px; top: 0px; left: 424px; width: 589px; height: 798px; position: relative;" alt="Marilyn Undressing C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3dc8e4b0111ed61279d1/1444823271253/7+-+36+-+Breasts+-+Sepia_LoRes.jpg?format=2500w"
        data-image-resolution="2500w">
      </div>

      <div data-slide-url="hxzcjn2dokmsl5m8q3p547s03n74xa" data-slide-id="561e3ebce4b006d31181e84c" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_217" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="2772x1845" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3ebce4b006d31181e84c/1444823270781/Elton-colonic.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3ebce4b006d31181e84c/1444823270781/Elton-colonic.jpg"
        class="slide-photo" style="font-size: 0px; top: 0px; left: 119px; width: 1199px; height: 798px; position: relative;" alt="Elton has Colonic C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e3ebce4b006d31181e84c/1444823270781/Elton-colonic.jpg?format=2500w"
        data-image-resolution="2500w">
      </div>

      <div data-slide-url="fz6fd3xi34im798puf0fvjn1z0yvgw" data-slide-id="54c2306ae4b0fe251ef9410a" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_219" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="683x1024" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/54c2306ae4b0fe251ef9410a/1444823270830/0Yz1Ak7xMMlEzJ4H6bkvw74ISAYeFtGJYJv8D8nsdfY.jpeg"
        data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/54c2306ae4b0fe251ef9410a/1444823270830/0Yz1Ak7xMMlEzJ4H6bkvw74ISAYeFtGJYJv8D8nsdfY.jpeg" class="slide-photo" style="font-size: 0px; top: 0px; left: 452px; width: 533px; height: 798px; position: relative;"
        alt="Queen at William Hill C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/54c2306ae4b0fe251ef9410a/1444823270830/0Yz1Ak7xMMlEzJ4H6bkvw74ISAYeFtGJYJv8D8nsdfY.jpeg?format=1500w"
        data-image-resolution="1500w">
      </div>

      <div data-slide-url="y4d6tul9hptqw68l7rbh871qrq0uun" data-slide-id="54c230b9e4b07b213a484c9c" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_221" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="1000x667" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/54c230b9e4b07b213a484c9c/1444823271255/Wills_Kate_Baby_Bath_Helicopter.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/54c230b9e4b07b213a484c9c/1444823271255/Wills_Kate_Baby_Bath_Helicopter.jpg"
        class="slide-photo" style="font-size: 0px; top: 0px; left: 120px; width: 1197px; height: 798px; position: relative;" alt="Wills, Kate and the Baby in the Bath C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/54c230b9e4b07b213a484c9c/1444823271255/Wills_Kate_Baby_Bath_Helicopter.jpg?format=2500w"
        data-image-resolution="2500w">
      </div>

      <div data-slide-url="2015/10/14/queen-tries-on-marigolds-c-type-archival-print" data-slide-id="561e4959e4b0f8015d9008e6" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_223" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="400x600" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e4959e4b0f8015d9008e6/1444825475506/" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e4959e4b0f8015d9008e6/1444825475506/"
        class="slide-photo loaded" style="font-size: 0px; top: 0px; left: 452px; width: 532px; height: 798px; position: relative;" alt="Queen tries on Marigolds. C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e4959e4b0f8015d9008e6/1444825475506/?format=1500w"
        data-image-resolution="1500w">
      </div>

      <div data-slide-url="2015/10/14/diana-gives-the-finger-c-type-archival-print" data-slide-id="561e49e0e4b08862a349ef7b" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_225" data-type="image" style="opacity: 0; z-index: 888;">
        <img data-image-focal-point="0.5,0.5" data-image-dimensions="1280x953" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e49e0e4b08862a349ef7b/1444825980193/" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e49e0e4b08862a349ef7b/1444825980193/"
        class="slide-photo" style="font-size: 0px; top: 0px; left: 182px; width: 1072px; height: 798px; position: relative;" alt="Diana gives the finger. C Type Archival Print" src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/561e49e0e4b08862a349ef7b/1444825980193/?format=2500w"
        data-image-resolution="2500w">
      </div>

    </div>
    <div class="gallery-controls">
      <span class="gallery-prev"><span>Prev</span></span><span class="gallery-divider"></span><span class="gallery-next"><span>Next</span></span>
    </div>
  </div>



  <!-- <div id="simpleControls">
      <span class="wrapper"><span class="control prev-slide">prev</span> / <span class="control next-slide">next</span></span>
  </div> -->



</div>

Answer

Satwik Nadkarny picture Satwik Nadkarny · Oct 14, 2015

You can do this using simple JavaScript :

var img = document.getElementById("imgGoogle");
document.getElementById('divText').innerHTML = img.alt;
<img id="imgGoogle" src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt="This is Google's logo">
<div id="divText"></div>

To do this using jQuery, you can do :

var altText = ($("#imgGoogle").attr("alt"));
$('#divText').html(altText);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<img id="imgGoogle" src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt="Google's logo">
<div id="divText"></div>

EDIT : To answer your query of multiple images, you can use jQuery to do this :

$.each($(".imgGoogle"), function() {
    var altText = $(this).attr('alt');
    
    $(this).next().html(altText);
});
.divText {
    background-color: rgba(51, 51, 51, 0.81);
    color: #fff;
    padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<img class="imgGoogle" src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" alt="Google's logo">
<div class="divText"></div>
    <br>
<img class="imgGoogle" src="http://72gpf1za5iq428ekh3r7qjc1.wpengine.netdna-cdn.com/wp-content/uploads/2015/02/google.png" alt="Google's logo 2">
<div class="divText"></div>
    <br>
<img class="imgGoogle" src="http://www.google.com/logos/2011/ausday11-hp.jpg" alt="Google's logo 3">
<div class="divText"></div>
    <br>
<img class="imgGoogle" src="http://searchengineland.com/figz/wp-content/seloads/2014/08/google-algorithm-fade-ss-1920-800x450.jpg" alt="Google's logo 4">
<div class="divText"></div>

EDIT : To answer with respect to the output html you have provided :

$.each($(".slide-photo"), function() {
    var newDiv = document.createElement("div");
    var altText = $(this).attr('alt');
    $(newDiv).html(altText);
    $(newDiv).attr('class','divAltText');
    $(this).after(newDiv);
});
div.slide {
    box-shadow: 2px 2px 5px 3px #888;
    border-radius: 6px;
    margin: 20px auto;
    max-width: 100%;
    padding: 10px 0px;
    text-align: center;
    width:100%;
}

div.slide img {
    max-width: 85%;
    width:100%;
    margin: 0 auto;
}

.divAltText {
    display: inline-block;
    background-color: rgba(51, 51, 51, 0.81);
    color: #fff;
    padding: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="galleryWrapper">
    <div id="slideshowWrapper">
        <div id="slideshow" class="sqs-gallery-design-stacked">
            <div data-slide-url="xhpxqx84l4s2dz1sxvz24un4h9bt5h" data-slide-id="544d38fbe4b0dd27d7036a64" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_199" data-type="image" >
                <img data-image-focal-point="0.5,0.5" data-image-dimensions="552x666" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fbe4b0dd27d7036a64/1444823277877/03-OBAMA_SMOKING_XMAS_231012_HiRes-1024x682.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fbe4b0dd27d7036a64/1444823277877/03-OBAMA_SMOKING_XMAS_231012_HiRes-1024x682.jpg" class="slide-photo"  alt="Obama Smoking 2012. C Type Archival Print" src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" data-image-resolution="1500w">
            </div>
            <div data-slide-url="wte8thrzcfhfe00unh2q75vtzj7n0i" data-slide-id="544d38fce4b0dd27d7036a66" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_201" data-type="image" >
                <img data-image-focal-point="0.5,0.5" data-image-dimensions="1024x690" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fce4b0dd27d7036a66/1444826067827/04-2002_Marilyn_wank_window_bars-1024x690.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fce4b0dd27d7036a66/1444826067827/04-2002_Marilyn_wank_window_bars-1024x690.jpg" class="slide-photo" alt="Marilyn Reclining C Type Archival Print" src="http://72gpf1za5iq428ekh3r7qjc1.wpengine.netdna-cdn.com/wp-content/uploads/2015/02/google.png" data-image-resolution="2500w">
            </div>
            <div data-slide-url="fl83poim6cqov9t6i4qpg30jp7galt" data-slide-id="544d38fee4b0dd27d7036a70" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_203" data-type="image" >
                <img data-image-focal-point="0.5,0.5" data-image-dimensions="682x1024" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a70/1444821495137/05-2824_001-Queen-on-looHR-682x1024.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a70/1444821495137/05-2824_001-Queen-on-looHR-682x1024.jpg" class="slide-photo"  alt="Queen on the Loo C Type Archival Print" src="http://www.google.com/logos/2011/ausday11-hp.jpg" data-image-resolution="1500w">
            </div>
            <div data-slide-url="2zrbx5dnwpzuczi0vx7ewgeqa7nhbn" data-slide-id="544d38fee4b0dd27d7036a72" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_205" data-type="image" >
                <img data-image-focal-point="0.5,0.5" data-image-dimensions="1024x771" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a72/1444821531252/06-BRANGELINAS_ORPHANAGE_HIRES_S-1024x771.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d38fee4b0dd27d7036a72/1444821531252/06-BRANGELINAS_ORPHANAGE_HIRES_S-1024x771.jpg" class="slide-photo" alt="Brangelinas at the Orphanage C Type Archival Print" src="http://searchengineland.com/figz/wp-content/seloads/2014/08/google-algorithm-fade-ss-1920-800x450.jpg" data-image-resolution="2500w">
            </div>
            <div data-slide-url="ibzi4a7wff74lm3vdducwz4zyp1c7w" data-slide-id="544d3901e4b013df5bcd17be" class="slide sqs-gallery-design-stacked-slide loaded" id="yui_3_17_2_1_1444864321837_207" data-type="image" >
                <img data-image-focal-point="0.5,0.5" data-image-dimensions="682x1024" data-image="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b013df5bcd17be/1444821567803/08-083-Marilyn-Back%2BJFK-682x1024.jpg" data-src="http://static1.squarespace.com/static/544d37fde4b0420e8843b42e/544d38eee4b04e8632c630f6/544d3901e4b013df5bcd17be/1444821567803/08-083-Marilyn-Back%2BJFK-682x1024.jpg" class="slide-photo"  alt="Marilyn and JFK C Type Archival Print" src="http://core0.staticworld.net/images/article/2014/09/google_tunnel-100432147-primary.idge.jpg" data-image-resolution="1500w">
            </div>

Hope this helps!!!