Note that there are some explanatory texts on larger screens.

plurals
  1. PO.hidden-phone not working for Bootstrap carousel
    primarykey
    data
    text
    <p>I am making a responsive site using Bootstrap. I am trying to hide a slider on phones. I am using the class <code>.hidden-phone</code> to achieve this. However, it is not working for me. If I use <code>.hidden-desktop</code> it hides it on the desktop site as well as the phone. Can someone check out my code and possibly demo it as well? Thanks.</p> <p><a href="http://wwwdev.cco.purdue.edu/boot/welcome.shtml" rel="nofollow">site</a></p> <p>Code:</p> <pre><code>&lt;body&gt; &lt;div class="container" style="position: relative"&gt; &lt;div class="carousel slide hidden-phone" id="myCarousel"&gt; &lt;ol class="carousel-indicators"&gt; &lt;li data-target="#myCarousel" data-slide-to="0" class="active"&gt;&lt;/li&gt; &lt;li data-target="#myCarousel" data-slide-to="1"&gt;&lt;/li&gt; &lt;li data-target="#myCarousel" data-slide-to="2"&gt;&lt;/li&gt; &lt;/ol&gt; &lt;div class="carousel-inner"&gt; &lt;div class="item active"&gt; &lt;!--&lt;img src="/ImageSlider/21centuryimages/sliderimages/USS.JPG" /&gt;--&gt; &lt;/div&gt; &lt;div class="item"&gt; &lt;img src="../ImageSlider/21centuryimages/sliderimages/Bechtel.jpg" /&gt; &lt;/div&gt; &lt;div class="item"&gt; &lt;img src="../ImageSlider/21centuryimages/sliderimages/ADM.jpg" /&gt; &lt;/div&gt; &lt;/div&gt; &lt;a class="carousel-control left" href="#myCarousel" data-slide="prev"&gt;&amp;lsaquo;&lt;/a&gt; &lt;a class="carousel-control right" href="#myCarousel" data-slide="next"&gt;&amp;rsaquo;&lt;/a&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    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. This table or related slice is empty.
 

Querying!

 
Guidance

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