css - twitter bootstrap custom carousel indicators -


i want change carousel indicators this:

custom carousel indicators

i have markup carousel indicators:

<ol class="carousel-indicators">       <li data-target="#showcarousel-03" data-slide-to="0" class="active">         <h4>image1</h4><br/><h5>subtitle</h5><br/><span>+</span>     </li>       <li data-target="#showcarousel-03" data-slide-to="0" class="active">         <h4>image2</h4><br/><h5>subtitle</h5><br/><span>+</span>     </li>     <li data-target="#showcarousel-03" data-slide-to="2">         <h4>image3</h4><br/><h5>subtitle</h5><br/><span>+</span>     </li>     <li data-target="#showcarousel-03" data-slide-to="0" class="active">         <h4>image4</h4><br/><h5>subtitle</h5><br/><span>+</span>     </li>                      </ol>

css: 

    .carousel-indicators {      position: absolute;      top: 0px;      left: 0px;      z-index: 5;      margin: 0;     list-style: none;      }       .carousel-indicators li{     background: url(images/triangle.png) no-repeat;     width:320px;     height:176px;     cursor: pointer;     text-align:center; }

when resize browser carousel adapts width of screen indicators collapsing.

can me tip on how can make scale on lower resolutions carousel images does?

thank you!

l.e:

i've tried put li elements this: 

 <div class="row-fluid">  <div class="span3>  <li data-target="#showcarousel-03" data-slide-to="0" class="active">     <h4>image1</h4><br/><h5>subtitle</h5><br/><span>+</span>   </li>   <div class="span3>  <li data-target="#showcarousel-03" data-slide-to="0" class="active">     <h4>image1</h4><br/><h5>subtitle</h5><br/><span>+</span>    </li>    <div class="span3>  <li data-target="#showcarousel-03" data-slide-to="0" class="active">     <h4>image1</h4><br/><h5>subtitle</h5><br/><span>+</span>  </li>  </div>  </div>

but it's not working.

you use media query -

@media screen , (max-width:480px) {      .carousel-indicators li{         background: url(images/triangle.png) no-repeat;         background-size:120px 60px;         width:120px;         height:60px;         cursor: pointer;         text-align:center;     }

Comments

Post a Comment

Popular posts from this blog

ios - iPhone/iPad different view orientations in different views , and apple approval process -

i force app's home screen portrait , other views landscape. apple rejects app if this? if not , how force first screen launch in portrait mode? , force other screens launch in landscape. this not duplicate question search every possible answer in website. i force app's home screen portrait , other views landscape. apple rejects app if this? no apple not reject app this. have lot of apps doesn't support orientation. forcing on 1 screen won't cause app reject. if not , how force first screen launch in portrait mode? , force other screens launch in landscape. can on write : -(nsuinteger)supportedinterfaceorientations; function.
Read more

java Extracting Zip file -

i'm looking way extract zip file. far have tried java.util.zip , org.apache.commons.compress, both gave corrupted output. basically, input zip file contain 1 single .doc file. java.util.zip: output corrupted. org.apache.commons.compress: output blank file, 2 mb size. so far commercial software winrar work perfectly. there java library make use of this? this method using java.util library: public void extractzipnative(file filezip) { zipinputstream zis; stringbuilder sb; try { zis = new zipinputstream(new fileinputstream(filezip)); zipentry ze = zis.getnextentry(); byte[] buffer = new byte[(int) ze.getsize()]; fileoutputstream fos = new fileoutputstream(this.tempfolderpath+ze.getname()); int len; while ((len=zis.read(buffer))>0) { fos.write(buffer); } fos.flush(); fos.close(); } catch (filenotfoundexception e) { // todo auto-generated catch block ...
Read more

C# WinForm - loading screen -

i ask how make loading screen (just picture or something) appears while program being loaded, , disappears when program has finished loading. in fancier versions, have seen process bar (%) displayed. how can have that, , how calculate % show on it? i know there form_load() event, not see form_loaded() event, or % property / attribute anywhere. all need create 1 form splash screen , show before main start showing landing page , close splash once landing page loaded. class splashform { //delegate cross thread call close private delegate void closedelegate(); //the type of form displayed splash screen. private static splashform splashform; static public void showsplashscreen() { // make sure launched once. if (splashform != null) return; thread thread = new thread(new threadstart(splashform.showform)); thread.isbackground = true; thread.setapartmentstate(apartmentstate.sta); thread....
Read more