javascript - How to dynamically append text to images in a carousel? -
the carousel in question elastislide http://tympanus.net/development/elastislide/index.html, mine displayed after search results inside carousel have no way add text text dynamically in order make clear user result is.
<!-- elastislide carousel , overlay --> <ul id="carousel" class="elastislide-list"> <?php if(isset($_post["title"])) { $se = $_post['title']; $dbh = new pdo("mysql:host=$host;dbname=$dbname", $user, $pass); $sth = $dbh->prepare("select subjects_id subjects title '%".$se."%'"); $sth->execute(); $result = $sth->fetchall(); $arr = $result; $image=2; $length = count($arr); ($i=0; $i < $length && $i<40; $i++) { if ($arr[$i]!="") { echo'<li><a id="dummy" href="http://localhost/website/subjects/view/'.$arr[$i][0].'" ><img src="images/small/'.$image.'.jpg" alt="image02" /></a></li>'; $image++; } } } ?> </ul> <script type="text/javascript"> ( function($) { $( '#carousel' ).elastislide(); } ) ( jquery ); </script> <!-- end elastislide carousel , overlay -->
check answer here
you can add div after image , change content dynamically.
<ul id="carousel" class="elastislide-list"> <div id="description"> <label id="caption">first image</label> </div>
hope helps.
Comments
Post a Comment