CSS - 浮动元素与范围

时间:2013-11-11 19:02:23

标签: javascript jquery html css

我正在尝试这样做,以便当您更改浏览器的大小时,我的滑块上的浮动内容会随页面变小。例如,如果您使用浏览器并更改其大小以使其仅占用显示器空间的一半,则会缩小所有内容以缩放。

到目前为止,整个页面正在这样做,它只是我的滑块没有正确执行。

链接:http://skipq.net/app/indextest.php

代码:

        <div class="flexslider">
          <ul class="slides">
            <li><img src="http://skipq.net/app/images/banner1.png" />
              <div class="context">
              <div class="context-inn"><h2>This app is money.</h2>
              <span class="description">Use our new app to pay at your favorite stores.<br />
When it comes time to check out,<br />
choose how you want to pay in a few taps.</span>
<div class="banner-form" id="banner-form1">Paying is easier with our new app<br />
  <form id="form1" name="form1" method="post" action="">    
    <input type="text" name="keywords" id="keywords" onblur="if(this.value=='') this.value='Mobile number (ex. 555-555-5555)';" onfocus="if(this.value=='Mobile number (ex. 555-555-5555)') this.value='';" value="Mobile number (ex. 555-555-5555)" alt="Mobile number (ex. 555-555-5555)"><br />
       <div style="display:none;" id="carrierSelection">
          <select name="carrier" style="font">
           <option value="Verizon">Verizon</option>
           <option value="AT_and_T">AT&T</option>
           <option value="Sprint">Sprint</option>
           <option value="T_Mobile">T-Mobile</option>
        </select> 
      </div>
    <input type="button" name="button" id="chbutton" value="Choose Your Carrier" />

  </form>
<span class="note">By continuing, you confirm this is your number and agree to receive a text. Standard messaging rates apply.</span>
<ul class="mobileicons">
<li class="android">Android</li>
<li class="iphone">iPhone</li>
</ul>
</div></div></div>
            </li>
            <li> <img src="http://skipq.net/app/images/banner2.png" />
              <div class="context"><div class="context-inn"><h2>More time is more money.</h2>
              <span class="description">When you sell online with PayPal and offer financing <br />
with Bill Me Laterョ, your buyers can get even more. <br />
You get paid up front, they get up to 6 months to pay.<br />
<span class="font11">Subject to credit approval. <a href="#">See Terms</a></span> </span>
<div class="banner-form">Sell more online with us<br />
  <form id="form1" name="form1" method="post" action="">    
    <input type="submit" name="button" id="button" value="Start Offering Financing" />
  </form>
</div></div></div>
            </li>
            <li> <img src="http://skipq.net/app/images/banner3.png" />
              <div class="context"><div class="context-inn"><h2>Tap into savings <br />
at hundreds of stores.</h2>
              <span class="description">Enjoy savings up to 40% off at hundreds of your <br />
favorite stores every day on PayPal Shopping.</span>
<div class="banner-form">Save at more stores with us<br />
  <form id="form1" name="form1" method="post" action="">    
    <input type="submit" name="button" id="button" value="Shop the Deals" />
  </form>
</div></div></div>
            </li>
            <li> <img src="http://skipq.net/app/images/banner4.png" />
              <div class="context"><div class="context-inn"><h2>Take six months off.</h2>
              <span class="description">We bought you some extra time to pay<br />
on anything over $99. Bill Me Laterョ<br />
is subject to credit approval. <a href="#">See Terms</a></span>
<div class="banner-form">A little time goes a long way<br />
  <form id="form1" name="form1" method="post" action="">    
    <input type="submit" name="button" id="button" value="Start Offering Financing" />
  </form>
</div></div></div>
            </li>
          </ul>
        </div>
      </div>

让我知道您需要哪些代码来检测问题所在!

0 个答案:

没有答案