Databases
StackOverflow2013
Postsdbo
POHow to create and AJAX Anything Slider (Long post)
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to create and AJAX Anything Slider (Long post)
    primarykey
    data
    text
    <p>I'm using php, the Anything Slider jQuery plugin from CSS Tricks, and jQuery AJAX to try to create a slider where I can just add images to a directory and have the slider update automatically. Below, I'll post the PHP, Javascript and HTML, then I'll explain the issues.</p> <pre><code>&lt;?php function hello(){ $dir ='../images'; // Open a known directory, and proceed to read its contents if (is_dir($dir)) { if ($dh = opendir($dir)) { while (($file = readdir($dh)) !== false) { if ($file != "." &amp;&amp; $file != ".." &amp;&amp; $file != ".DS_Store"&amp;&amp; $file != "../images") { echo "&lt;li&gt;&lt;img src=\"http://localhost:8888/wordpress/wp-content/themes/perpetualC/images/$file\" class=\"image\"&gt;&lt;/li&gt; \n"; //add &lt;li&gt; tags, trying to fix the problem... } } closedir($dh); } } } hello(); ?&gt; </code></pre> <p>This functions perfectly and is in a file called image.php, which is called perfectly by the following block of code.</p> <pre><code>$(document).ready(function() { $.get('images.php', function(data) { var lines = data.split("\n"); $.each(lines, function(n, elem) { $('#slider').append( elem ); //comment out an attempt to fix the issue, the &lt;li&gt; tags here were replaced by tags in the PHP. //$('.image').wrap('&lt;li&gt;'); }); }); $('#slider').anythingSlider({ resizeContents: true, addWmodeToObject: 'transparent', autoPlay: true, delay: 1500 }); }); // end ready </code></pre> <p>Now here's where the problems start. This renders the following block of code from Firebug</p> <pre><code>&lt;section class="stuff"&gt; &lt;div style="width: 860px; height: 200px;" class="anythingSlider anythingSlider-default activeSlider"&gt; &lt;div class="anythingWindow"&gt; &lt;ul style="width: 0px;" class="anythingBase horizontal" id="slider"&gt; &lt;li&gt;&lt;img src="http://localhost:8888/images/bg.jpg" class="image"&gt;&lt;/li&gt; &lt;li&gt;&lt;img src="http://localhost:8888/images/bg.psd" class="image"&gt;&lt;/li&gt; &lt;li&gt;&lt;img src="http://localhost:8888/images/bg1.jpg" class="image"&gt;&lt;/li&gt; &lt;li&gt;&lt;img src="http://localhost:8888images/bg2.jpg" class="image"&gt;&lt;/li&gt; &lt;li&gt;&lt;img src="http://localhost:8888/images/blackTransGradient.png" class="image"&gt;&lt;/li&gt; &lt;li&gt;&lt;img src="http://localhost:8888/images/whiteTransGradient.png" class="image"&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div style="display: none;" class="anythingControls"&gt; &lt;ul style="display: none;" class="thumbNav"&gt; &lt;/ul&gt; &lt;a style="display: none;" href="#" class="start-stop playing"&gt;&lt;span&gt;Stop&lt;/span&gt;&lt;/a&gt;&lt;/div&gt; &lt;span style="display: none;" class="arrow back"&gt;&lt;a href="#"&gt;&lt;span&gt;«&lt;/span&gt;&lt;/a&gt;&lt;/span&gt;&lt;span style="display: none;" class="arrow forward"&gt;&lt;a href="#"&gt;&lt;span&gt;»&lt;/span&gt;&lt;/a&gt;&lt;/span&gt;&lt;/div&gt; </code></pre> <p></p> <p>This... does nothing! A properly working Anything Slider will have classes on the <code>&lt;li&gt;</code> tags that change at a set interval... this has no classes at all. Any help? Where's my problem? I know something like this is possible because of the this jsFiddle, <a href="http://jsfiddle.net/Cm479/248/" rel="nofollow">http://jsfiddle.net/Cm479/248/</a> but I'm not sure how to go about fixing my problem</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USJonathan
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POHow to create and AJAX Anything Slider (Long post)
      1. UScodewaggle
      1. VTFavorite
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload