Bootstrap 3: Modal with carousel - buggy in Safari on iPad and iPhone

http://ikonltd.com/current/bs.html

The above code works seamlessly on desktop in all browsers (except safari windows). It also works perfectly on iPad (Chrome).

However, once I move to Safari on iPhone or iPad, it is very buggy.  Sometimes the correct image will come up in the modal and scrolling to previous and next works perfectly. Sometimes the wrong image pops up when I click on a thumb and it scrolls back to the first image. And, a lot of the time, the modal pops up without any image (see embedded) again on iPad Safari.

ipad-modal-missing-image.PNG
Here's the js I'm using:

<script src="http://ikonltd.com/js/jquery.mobile.custom.min.js"></script>

<script type="text/javascript">
    /* copy loaded thumbnails into carousel */
$('.row .thumbnail').click(function(e){
    e.preventDefault();
  
}).each(function(i) {
  if(this.complete) {
  	var item = $('<div class="item"></div>');
    var itemDiv = $(this).parents('div');
    var title = $(this).parent('a').attr("title");
    
    item.attr("title",title);
  	$(itemDiv.html()).appendTo(item);
  	item.appendTo('.carousel-inner'); 
    if (i==0){ // set first item active
     item.addClass('active');
    }
  }
});

/* activate the carousel */
$('#modalCarousel').carousel({interval:false});

/* change modal title when slide changes */
$('#modalCarousel').on('slid.bs.carousel', function () {
  $('.modal-title').html($(this).find('.active').attr("title"));
})

/* when clicking a thumbnail */
$('.row .thumbnail').click(function(){
    var idx = $(this).parents('div').index();
  	var id = parseInt(idx);
  	$('#myModal').modal('show'); // show the modal
    $('#modalCarousel').carousel(id); // slide carousel to selected
  	
});

    </script>
    
    <script>
	$('#modal').on('hidden.bs.modal', function() {
    $(this).removeData('bs.modal');
});
    </script>
    
   

<script type="text/javascript">
$(document).ready(function() {
$("#modalCarousel").swiperight(function() {
$(this).carousel('prev');
});
$("#modalCarousel").swipeleft(function() {
$(this).carousel('next');
});
});
</script> 

Open in new window


Here's one of the thumbs:

<div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-History Kids" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/ruscha_history-kids-frame.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-History Kids" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->

Open in new window


Here is the modal:

 <!--modal html-->
<div class="modal" id="myModal" role="dialog">
  <div class="modal-dialog">
  <div class="modal-content">
	<div class="modal-header">
		<button class="close" type="button" data-dismiss="modal">×</button>
		<h3 class="modal-title"></h3>
	</div>
	<div class="modal-body">
		<div id="modalCarousel" class="carousel">
          <div class="carousel-inner"></div>
                   <a class="carousel-control left" href="#modalCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a>
          <a class="carousel-control right" href="#modalCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a>
        </div>
	</div>
	<div class="modal-footer">
		<button class="btn btn-default" data-dismiss="modal">Close</button>
	</div>
   </div>
  </div>
</div>
<!--/modal html-->

Open in new window


I got this code from this bootply:

http://www.bootply.com/IHrfRrJGhQ
phillystyle123Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

phillystyle123Author Commented:
Here's the entire page of code:

<!DOCTYPE html> 
<html> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<TITLE>IKON ltd. - Current Exhibtion: Recent Acquisitions 2015 </TITLE>


<!-- Bootstrap -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="http://ikonltd.com/css/bootstrap.min.css" rel="stylesheet">
    <link href="http://ikonltd.com/css/custom.css" rel="stylesheet">
    <script src="http://ikonltd.com/js/respond.js"></script>
    <!--end bootstrap-->

<link href="http://ikonltd.com/css/main.cfm" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>


<!--background from nahem site-->
<script type="text/javascript" src="http://ikonltd.com/js/MooTools-Core-1.5.1.js"></script>
<script type="text/javascript" src="http://ikonltd.com/js/fullscreen_bg/moo_12.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>

<!--tool tip js for artist landing page descriptive text painting text rollover-->
<script type="text/javascript">

var baseopacity=100

function showtext(thetext){
if (!document.getElementById)
return
textcontainerobj=document.getElementById("tabledescription")
browserdetect=textcontainerobj.filters? "ie" : typeof textcontainerobj.style.MozOpacity=="string"? "mozilla" : ""
instantset(baseopacity)
document.getElementById("tabledescription").innerHTML=thetext
highlighting=setInterval("gradualfade(textcontainerobj)",50)
}

function hidetext(){
cleartimer()
instantset(baseopacity)
}

function instantset(degree){
if (browserdetect=="mozilla")
textcontainerobj.style.MozOpacity=degree/100
else if (browserdetect=="ie")
textcontainerobj.filters.alpha.opacity=degree
else if (document.getElementById && baseopacity==0)
document.getElementById("tabledescription").innerHTML=""
}

function cleartimer(){
if (window.highlighting) clearInterval(highlighting)
}

function gradualfade(cur2){
if (browserdetect=="mozilla" && cur2.style.MozOpacity<1)
cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.2, 0.99)
else if (browserdetect=="ie" && cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=20
else if (window.highlighting)
clearInterval(highlighting)
}
</script>
<!--eof tool tip js for artist landing page descriptive text painting text rollover-->



</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12 col-xs-12 logoNew" style="background:#126eca;">
<a  href="http://ikonltd.com/"><img class="img-responsive" border="0" src="http://ikonltd.com/images/logo-trans-new.png" /></a>
</div>
</div><!--.row-->

<!-- row 1: navigation -->
    <div class="row">
      <nav class="navbar navbar-default" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#collapse">
            <span class="sr-only">Toggle Navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
        <div class="collapse navbar-collapse" id="collapse">
            <ul class="nav navbar-nav  nav-justified">
<li class="active"><a  href="http://ikonltd.com/current/">Current Exhibition</a></li>
<li ><a href="http://ikonltd.com/new/">Featured Works</a></li>
<li ><a href="http://ikonltd.com/artists/">Artists</a></li>
<li ><a href="http://ikonltd.com/past/">Past Exhibitions</a></li>
<li ><a href="http://ikonltd.com/about/">About</a></li>
<li ><a href="http://ikonltd.com/contact/">Contact</a></li>
<li ><a href="http://ikonltd.com/">Home</a></li>
</ul>
          </div>
       </div><!--eof container-->
      </nav>
    </div>

<div class="row">

<!--if logic to determine visability of "Editions" sidenav link-->

<!--if logic to determine visability of "Unique" sidenav link-->


<aside class="col-md-3 col-xs-12">
<div class="panel panel-default">

<div  class="panel-heading">
Current Exhibition</div><!--end panel-heading-->
<div class="panel-body">
<span style="font-weight:bold;">Recent Acquisitions 2015</span><br />
March 24, 2015 - May 
                            30, 2015 
                    <div class="titleDateSep">	
                    <p><a href="/current-unique/" >Unique</a> | <a href="/current-editions/" >Editions</a> 
                    </div>	
                    


<div id="coolmenu" style="margin-top:10px;">
    <div id="tabledescription"></div>
  </div>
   
	 
	 
<div class="sharePage">
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a href="http://www.addthis.com/bookmark.php?v=250&amp;username=xa-4bf2dbc80f1a8389" class="addthis_button_compact">Share</a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4bf2dbc80f1a8389"></script>
<!-- AddThis Button END -->
</div>

</div><!--end panel-body-->
</div><!--end panel-->
</aside><!--end aside-->
<article class="col-md-9 col-xs-12"><!-- article-->
<div class="row images">

 
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-History Kids" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/ruscha_history-kids-frame.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-History Kids" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Cheese Mold Standard with Olive" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/Ruscha_cheesemold-standard.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Cheese Mold Standard with Olive" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/ruscha_hollywood-9-unframed.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Fruit-Metrecal Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/ruscha_fruit-metrecal.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Fruit-Metrecal Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Andy Warhol-The Shadow" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)" href="#" onMouseover="showtext('<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/Warhol-Shadow.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Andy Warhol-The Shadow" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site Avec Sept Personnages" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas" href="#" onMouseover="showtext('<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/dubuffet_-Site-Avec-Sept-Personnages.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site Avec Sept Personnages" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Stella Vine-Jean Tiger Skin" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas" href="#" onMouseover="showtext('<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/vine_jean-tiger-skin.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Stella Vine-Jean Tiger Skin" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site De Memoire II" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10" href="#" onMouseover="showtext('<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/dubuffet_Site-De-Memoire-II.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site De Memoire II" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-Love - Saves the Day" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100" href="#" onMouseover="showtext('<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/miller_love-saves-the-day.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-Love - Saves the Day" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Matt Greene-Mater Suspiriorum" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper" href="#" onMouseover="showtext('<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/greene_Mater-Suspiriorum-frame.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Matt Greene-Mater Suspiriorum" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas" href="#" onMouseover="showtext('<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/matta_untitled-1976-frame.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled (july 1970)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom" href="#" onMouseover="showtext('<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/matta_july-1970.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled (july 1970)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-You can rely on me, I’ll always let you down" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35" href="#" onMouseover="showtext('<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/miller_you-can-rely-on-me.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-You can rely on me, I’ll always let you down" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Howl" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40" href="#" onMouseover="showtext('<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/mutu_howl.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Howl" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Second Born" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35" href="#" onMouseover="showtext('<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/mutu_second-born.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Second Born" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Jean-Michel Basquiat-Untitled (Rinso)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint" href="#" onMouseover="showtext('<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/basquiat_rinso.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Jean-Michel Basquiat-Untitled (Rinso)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 1" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>" href="#" onMouseover="showtext('<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/03.15-acquistion-install1.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 1" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 2" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>" href="#" onMouseover="showtext('<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/03.15-acquistion-install2.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 2" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 3" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>" href="#" onMouseover="showtext('<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/03.15-acquistion-install3.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 3" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
  </div><!--end row for image grid-->
  
  <!--modal html-->
<div class="modal" id="myModal" role="dialog">
  <div class="modal-dialog">
  <div class="modal-content">
	<div class="modal-header">
		<button class="close" type="button" data-dismiss="modal">×</button>
		<h3 class="modal-title"></h3>
	</div>
	<div class="modal-body">
		<div id="modalCarousel" class="carousel">
          <div class="carousel-inner"></div>
                   <a class="carousel-control left" href="#modalCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a>
          <a class="carousel-control right" href="#modalCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a>
        </div>
	</div>
	<div class="modal-footer">
		<button class="btn btn-default" data-dismiss="modal">Close</button>
	</div>
   </div>
  </div>
</div>
<!--/modal html-->
 
<!--paginiation for new acquisitions landing page-->
 <div style="width:100%; float:left;">
 <p align="center"><b>1 - 19  of 19</b><br>
                                

                              </p>
							  </div>
<!--eof paginiation for new acquisitions landing page-->
</article><!--end article-->


</div><!--eof .row-->
</div><!--eof container-->




 


<!--new footer includes-->
<script type="text/javascript">
//<![CDATA[

FullScreenBG.init('http://ikonltd.com/images/2010/ikon-blank-wall.jpg');

//]]>
</script>
<!--eof show thumb on rollover for artist landing page-->
<!-- bootstrap javascript -->

	<script src="http://code.jquery.com/jquery-latest.min.js"></script>
    
    <script src="http://ikonltd.com/js/bootstrap.min.js"></script>
<!--end new footer includes-->
<script src="http://ikonltd.com/js/jquery.mobile.custom.min.js"></script>

<script type="text/javascript">
    /* copy loaded thumbnails into carousel */
$('.row .thumbnail').click(function(e){
    e.preventDefault();
  
}).each(function(i) {
  if(this.complete) {
  	var item = $('<div class="item"></div>');
    var itemDiv = $(this).parents('div');
    var title = $(this).parent('a').attr("title");
    
    item.attr("title",title);
  	$(itemDiv.html()).appendTo(item);
  	item.appendTo('.carousel-inner'); 
    if (i==0){ // set first item active
     item.addClass('active');
    }
  }
});

/* activate the carousel */
$('#modalCarousel').carousel({interval:false});

/* change modal title when slide changes */
$('#modalCarousel').on('slid.bs.carousel', function () {
  $('.modal-title').html($(this).find('.active').attr("title"));
})

/* when clicking a thumbnail */
$('.row .thumbnail').click(function(){
    var idx = $(this).parents('div').index();
  	var id = parseInt(idx);
  	$('#myModal').modal('show'); // show the modal
    $('#modalCarousel').carousel(id); // slide carousel to selected
  	
});

    </script>
    
    <script>
	$('#modal').on('hidden.bs.modal', function() {
    $(this).removeData('bs.modal');
});
    </script>
    
   

<script type="text/javascript">
$(document).ready(function() {
$("#modalCarousel").swiperight(function() {
$(this).carousel('prev');
});
$("#modalCarousel").swipeleft(function() {
$(this).carousel('next');
});
});
</script> 



</body>
</html>

Open in new window

0
bigeven2002Commented:
Hello,
For your script sources at lines 511-513, try moving those up to the HTML head tag at line 68.  This will make the page load a bit slower, but may fix the issue with Safari, at least iPad Safari.  The windows version of Safari is probably too old to support correctly.
0
phillystyle123Author Commented:
thanks bigeven2002. I swear I already tried that and it didn't work but now it seems to be working. I'm going to let it sit overnight and try again with a fresh eyes.
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

bigeven2002Commented:
Sounds good, thanks for the update.
0
phillystyle123Author Commented:
It seems to have improved but still running into the issue where no image is displaying in the modal window (see embedded image earlier in the thread). Also, the swipe is now buggy on iPhone. Sometimes it swipes, sometimes not.

I just copied the code over to a new page.

The link:  http://ikonltd.com/current/bs3.html

Here's the code:

<!DOCTYPE html> 
<html> 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<TITLE>IKON ltd. - Current Exhibtion: Recent Acquisitions 2015 </TITLE>


<!-- Bootstrap -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="http://ikonltd.com/css/bootstrap.min.css" rel="stylesheet">
    <link href="http://ikonltd.com/css/custom.css" rel="stylesheet">
    <script src="http://ikonltd.com/js/respond.js"></script>
    <!--end bootstrap-->

<link href="http://ikonltd.com/css/main.cfm" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>


<!--background from nahem site-->
<script type="text/javascript" src="http://ikonltd.com/js/MooTools-Core-1.5.1.js"></script>
<script type="text/javascript" src="http://ikonltd.com/js/fullscreen_bg/moo_12.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
    
    <script src="http://ikonltd.com/js/bootstrap.min.js"></script>

<!--tool tip js for artist landing page descriptive text painting text rollover-->
<script type="text/javascript">

var baseopacity=100

function showtext(thetext){
if (!document.getElementById)
return
textcontainerobj=document.getElementById("tabledescription")
browserdetect=textcontainerobj.filters? "ie" : typeof textcontainerobj.style.MozOpacity=="string"? "mozilla" : ""
instantset(baseopacity)
document.getElementById("tabledescription").innerHTML=thetext
highlighting=setInterval("gradualfade(textcontainerobj)",50)
}

function hidetext(){
cleartimer()
instantset(baseopacity)
}

function instantset(degree){
if (browserdetect=="mozilla")
textcontainerobj.style.MozOpacity=degree/100
else if (browserdetect=="ie")
textcontainerobj.filters.alpha.opacity=degree
else if (document.getElementById && baseopacity==0)
document.getElementById("tabledescription").innerHTML=""
}

function cleartimer(){
if (window.highlighting) clearInterval(highlighting)
}

function gradualfade(cur2){
if (browserdetect=="mozilla" && cur2.style.MozOpacity<1)
cur2.style.MozOpacity=Math.min(parseFloat(cur2.style.MozOpacity)+0.2, 0.99)
else if (browserdetect=="ie" && cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=20
else if (window.highlighting)
clearInterval(highlighting)
}
</script>
<!--eof tool tip js for artist landing page descriptive text painting text rollover-->



</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12 col-xs-12 logoNew" style="background:#126eca;">
<a  href="http://ikonltd.com/"><img class="img-responsive" border="0" src="http://ikonltd.com/images/logo-trans-new.png" /></a>
</div>
</div><!--.row-->

<!-- row 1: navigation -->
    <div class="row">
      <nav class="navbar navbar-default" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#collapse">
            <span class="sr-only">Toggle Navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>
        <div class="collapse navbar-collapse" id="collapse">
            <ul class="nav navbar-nav  nav-justified">
<li class="active"><a  href="http://ikonltd.com/current/">Current Exhibition</a></li>
<li ><a href="http://ikonltd.com/new/">Featured Works</a></li>
<li ><a href="http://ikonltd.com/artists/">Artists</a></li>
<li ><a href="http://ikonltd.com/past/">Past Exhibitions</a></li>
<li ><a href="http://ikonltd.com/about/">About</a></li>
<li ><a href="http://ikonltd.com/contact/">Contact</a></li>
<li ><a href="http://ikonltd.com/">Home</a></li>
</ul>
          </div>
       </div><!--eof container-->
      </nav>
    </div>

<div class="row">

<!--if logic to determine visability of "Editions" sidenav link-->

<!--if logic to determine visability of "Unique" sidenav link-->


<aside class="col-md-3 col-xs-12">
<div class="panel panel-default">

<div  class="panel-heading">
Current Exhibition</div><!--end panel-heading-->
<div class="panel-body">
<span style="font-weight:bold;">Recent Acquisitions 2015</span><br />
March 24, 2015 - May 
                            30, 2015 
                    <div class="titleDateSep">	
                    <p><a href="/current-unique/" >Unique</a> | <a href="/current-editions/" >Editions</a> 
                    </div>	
                    


<div id="coolmenu" style="margin-top:10px;">
    <div id="tabledescription"></div>
  </div>
   
	 
	 
<div class="sharePage">
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style">
<a href="http://www.addthis.com/bookmark.php?v=250&amp;username=xa-4bf2dbc80f1a8389" class="addthis_button_compact">Share</a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4bf2dbc80f1a8389"></script>
<!-- AddThis Button END -->
</div>

</div><!--end panel-body-->
</div><!--end panel-->
</aside><!--end aside-->
<article class="col-md-9 col-xs-12"><!-- article-->
<div class="row images">

 
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-History Kids" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/ruscha_history-kids-frame.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-History Kids" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>History Kids</i></b><br>2013<br>28 3/4 x 28 inches<br>Lithograph<br>Edition of 60" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Cheese Mold Standard with Olive" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/Ruscha_cheesemold-standard.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Cheese Mold Standard with Olive" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>Cheese Mold Standard with Olive</i></b><br>1969<br>19 x 37 inches<br>Color Screenprint on paper<br>Edition of 150" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/ruscha_hollywood-9-unframed.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>Hollywood</i></b><br>1968<br>17 1/2 x 44 1/4 inches<br>Screenprint on white paper<br>Edition of 100" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Fruit-Metrecal Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right" href="#" onMouseover="showtext('<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/ruscha_fruit-metrecal.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Ed Ruscha-Fruit-Metrecal Hollywood" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Ed Ruscha<br><i>Fruit-Metrecal Hollywood</i></b><br>1971<br>14 3/4 x 42 3/4 inches<br>Screenprint on paper<br>Edition of 85<br>Signed, dated, and numbered lower right" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Andy Warhol-The Shadow" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)" href="#" onMouseover="showtext('<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/Warhol-Shadow.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Andy Warhol-The Shadow" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Andy Warhol<br><i>The Shadow</i></b><br>1981<br>38 x 38 inches<br>Color screenprint with diamond dust on Lenox Museum board<br>Signed in pencil and numbered<br>Edition of 200 (30AP)" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site Avec Sept Personnages" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas" href="#" onMouseover="showtext('<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/dubuffet_-Site-Avec-Sept-Personnages.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site Avec Sept Personnages" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Jean Dubuffet<br><i>Site Avec Sept Personnages</i></b><br>1981<br>26 x 20 inches<br>Signed “J.D. 81”, lower right front<br>Acrylic on paper mounted on canvas" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Stella Vine-Jean Tiger Skin" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas" href="#" onMouseover="showtext('<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/vine_jean-tiger-skin.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Stella Vine-Jean Tiger Skin" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Stella Vine<br><i>Jean Tiger Skin</i></b><br>2005<br>72 x 60 inches<br>Acrylic on canvas" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site De Memoire II" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10" href="#" onMouseover="showtext('<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/dubuffet_Site-De-Memoire-II.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Jean Dubuffet-Site De Memoire II" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Jean Dubuffet<br><i>Site De Memoire II</i></b><br>1979<br>84 x 58 inches<br>Screenprint on canvas<br>Signed and numbered at bottom<br>Edition of 10" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-Love - Saves the Day" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100" href="#" onMouseover="showtext('<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/miller_love-saves-the-day.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-Love - Saves the Day" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Harland Miller<br><i>Love - Saves the Day</i></b><br>2014<br>57 1/2 x 41 3/4 inches<br>15 color silkscreen print<br>Edition of 100" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Matt Greene-Mater Suspiriorum" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper" href="#" onMouseover="showtext('<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/greene_Mater-Suspiriorum-frame.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Matt Greene-Mater Suspiriorum" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Matt Greene<br><i>Mater Suspiriorum</i></b><br>2005<br>44 1/2 x 44 1/2 inches<br>painting acrylic, graphite on paper" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas" href="#" onMouseover="showtext('<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/matta_untitled-1976-frame.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Roberto Matta<br><i>Untitled</i></b><br>1976<br>39 1/8 x 40 3/8 inches<br>Oil on canvas" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled (july 1970)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom" href="#" onMouseover="showtext('<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/matta_july-1970.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Roberto Matta-Untitled (july 1970)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Roberto Matta<br><i>Untitled (july 1970)</i></b><br>1970<br>19 x 24 3/4 inches<br>Pastel on paper<br>signed and dated at bottom" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-You can rely on me, I’ll always let you down" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35" href="#" onMouseover="showtext('<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/miller_you-can-rely-on-me.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Harland Miller-You can rely on me, I’ll always let you down" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Harland Miller<br><i>You can rely on me, I’ll always let you down</i></b><br>2011<br>16 5/8 x 13 1/4 inches<br>Inkjet print<br>Edition of 35" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Howl" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40" href="#" onMouseover="showtext('<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/mutu_howl.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Howl" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Wangechi Mutu<br><i>Howl</i></b><br>2006<br>35 x 24 inches<br>Archival pigment print with color screenprint on paper<br>Signed, dated and numbered<br>Edition of 40" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Second Born" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35" href="#" onMouseover="showtext('<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/mutu_second-born.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Wangechi Mutu-Second Born" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Wangechi Mutu<br><i>Second Born</i></b><br>2013<br>36 x 43 inches<br>24 Kt gold, collagraph, relief, digital printing, collage, and hand coloring <br>Edition of 35" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: Jean-Michel Basquiat-Untitled (Rinso)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint" href="#" onMouseover="showtext('<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/basquiat_rinso.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: Jean-Michel Basquiat-Untitled (Rinso)" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>Jean-Michel Basquiat<br><i>Untitled (Rinso)</i></b><br>1982/2001<br>40 x 40 inches<br>9 color screenprint" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 1" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>" href="#" onMouseover="showtext('<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/03.15-acquistion-install1.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 1" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 1</i></b>" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 2" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>" href="#" onMouseover="showtext('<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/03.15-acquistion-install2.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 2" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 2</i></b>" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
   <div class="col-lg-2 col-md-6 col-sm-6 col-xs-12 thumblike">
   <figure><a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 3" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a></figure>
            <a class="imgPop" title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>" href="#" onMouseover="showtext('<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>')" onMouseout="hidetext()"><img src="http://ikonltd.com/images/lg/03.15-acquistion-install3.jpg" border="0" class="thumbnail img-responsive pull-left"></a><aside class="caption pull-right">
<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>
                     <p class="buttonSpace"> 
                    <a href="mailto:ikon@ikonltd.com?Subject=re: INSTALLATION PHOTOS-2015 Recent Acquisitions Installation 3" class="btn btn-default btn-xs buttonSpace" rel="tooltip" title="Contact Gallery" role="button">Contact Gallery</a>
                    <a title="<b>INSTALLATION PHOTOS<br><i>2015 Recent Acquisitions Installation 3</i></b>" href="#" class="btn btn-default btn-xs buttonSpace thumbnail" rel="tooltip" role="button">More Detail</a>
                    
                    </p>
</aside><!--end caption-->


  
   </div><!--end thumb col-->
  
      
  </div><!--end row for image grid-->
  
  <!--modal html-->
<div class="modal" id="myModal" role="dialog">
  <div class="modal-dialog">
  <div class="modal-content">
	<div class="modal-header">
		<button class="close" type="button" data-dismiss="modal">×</button>
		<h3 class="modal-title"></h3>
	</div>
	<div class="modal-body">
		<div id="modalCarousel" class="carousel">
          <div class="carousel-inner"></div>
                   <a class="carousel-control left" href="#modalCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a>
          <a class="carousel-control right" href="#modalCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a>
        </div>
	</div>
	<div class="modal-footer">
		<button class="btn btn-default" data-dismiss="modal">Close</button>
	</div>
   </div>
  </div>
</div>
<!--/modal html-->
 
<!--paginiation for new acquisitions landing page-->
 <div style="width:100%; float:left;">
 <p align="center"><b>1 - 19  of 19</b><br>
                                

                              </p>
							  </div>
<!--eof paginiation for new acquisitions landing page-->
</article><!--end article-->


</div><!--eof .row-->
</div><!--eof container-->




 


<!--new footer includes-->
<script type="text/javascript">
//<![CDATA[

FullScreenBG.init('http://ikonltd.com/images/2010/ikon-blank-wall.jpg');

//]]>
</script>
<!--eof show thumb on rollover for artist landing page-->
<!-- bootstrap javascript -->

	
<!--end new footer includes-->
<script src="http://ikonltd.com/js/jquery.mobile.custom.min.js"></script>

<script type="text/javascript">
    /* copy loaded thumbnails into carousel */
$('.row .thumbnail').click(function(e){
    e.preventDefault();
  
}).each(function(i) {
  if(this.complete) {
  	var item = $('<div class="item"></div>');
    var itemDiv = $(this).parents('div');
    var title = $(this).parent('a').attr("title");
    
    item.attr("title",title);
  	$(itemDiv.html()).appendTo(item);
  	item.appendTo('.carousel-inner'); 
    if (i==0){ // set first item active
     item.addClass('active');
    }
  }
});

/* activate the carousel */
$('#modalCarousel').carousel({interval:false});

/* change modal title when slide changes */
$('#modalCarousel').on('slid.bs.carousel', function () {
  $('.modal-title').html($(this).find('.active').attr("title"));
})

/* when clicking a thumbnail */
$('.row .thumbnail').click(function(){
    var idx = $(this).parents('div').index();
  	var id = parseInt(idx);
  	$('#myModal').modal('show'); // show the modal
    $('#modalCarousel').carousel(id); // slide carousel to selected
  	
});

    </script>
    
<script type="text/javascript">
$(document).ready(function() {
$("#modalCarousel").swiperight(function() {
$(this).carousel('prev');
});
$("#modalCarousel").swipeleft(function() {
$(this).carousel('next');
});
});
</script> 



</body>
</html>

Open in new window

0
phillystyle123Author Commented:
Again, it seems totally random. I'm waiting for the entire page to load and sometimes I'm either getting the modal showing the carousel arrows, but nothing in the modal body, or I'm getting the wrong image loading into the modal body. Then, sometimes it works perfectly. It does work perfectly on desktop and chrome ipad -just not on safari ipad and iphones.
ipad-modal-missing-image.PNG
0
bigeven2002Commented:
Ok thanks for the update.  I will try to take another look this evening to see if I can find something.
0
phillystyle123Author Commented:
0
bigeven2002Commented:
Well, I tried what I could, but the randomness still happens for me too.  The success rate seemed to improve a little bit though with moving the script source lines 25 and 27 up to line 7:
<script src="http://code.jquery.com/jquery-latest.min.js"></script>    
<script src="http://ikonltd.com/js/bootstrap.min.js"></script>

Open in new window


I've tried on my iPad and iPhone, clearing cache from Safari, it still exhibits random image loading failures.  However, the randomness may not be so random, as in if it fails to load the first time, reloading the page has a 100% success rate for me.

So I researched online for issues where the carousel would fail to load images the first time but would the second.  What I found is that it is possible some of your scripts are conflicting with each other.

So I turned off the script source lines for Moo (lines 20-21).  The images are loading every time now, except of course the background image.

So my guess is that the conflict is between the Moo scripts and the jQuery Mobile scripts. (Lines 20-23).
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
phillystyle123Author Commented:
I think this solution works -thanks for the help
0
bigeven2002Commented:
Glad I could help!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.