Safari / IE中的AMP-html元素媒体查询

时间:2016-12-14 17:01:15

标签: internet-explorer safari amp-html

我正在使用元素媒体查询来显示2个不同的放大器轮播,因此我可以加载不同大小的图像,但它似乎不适用于IE或Safari。有一个更好的方法吗?以下是我的代码:

<!--carousel for mobile --> 
          <amp-carousel width="800"
              height="600"
              layout="responsive"
              type="slides"
              autoplay
              delay="5000"
              media="(max-width: 768px)">
              
          	<div class="slide">
                <amp-img src="/img/amp/slide1.jpg"
                width="800"
                height="600"
                layout="responsive"></amp-img>
                <div class="caption">
                    <h2>Unique Flavors</h2>
                </div>
            </div>
            <div class="slide">
                <amp-img src="/img/amp/slide2.jpg"
                width="800"
                height="600"
                layout="responsive"></amp-img>
                <div class="caption">
                    <h2>Always Fresh</h2>
                </div>
            </div>

          </amp-carousel>
          <!--/carousel for mobile --> 
          <!--carousel for desktop --> 
			<amp-carousel width="2000"
              height="700"
              layout="responsive"
              type="slides"
              autoplay
              delay="5000"
              media="(min-width: 769px)">
              
              <div class="slide">
                    <amp-img src="/img/slide1.jpg"
                    width="2000"
                    height="700"
                    layout="responsive"></amp-img>
                    <div class="caption">
                        <h2>Unique Flavors</h2>
                    </div>
                </div>
            <div class="slide">
                    <amp-img src="/img/slide2.jpg"
                    width="2000"
                    height="700"
                    layout="responsive"></amp-img>
                    <div class="caption">
                        <h2>Always Fresh</h2>
                    </div>
            </div>
          </amp-carousel>
          <!--/carousel for desktop --> 

0 个答案:

没有答案