Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/421.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/php/256.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 某些图片未显示在iphone布局上_Javascript_Php_Jquery_Html_Css - Fatal编程技术网

Javascript 某些图片未显示在iphone布局上

Javascript 某些图片未显示在iphone布局上,javascript,php,jquery,html,css,Javascript,Php,Jquery,Html,Css,该网站在iphone设备中显示图片时出现问题,通过水平最小化浏览器复制了该问题。 链接是否显示问题。 我的手动修复方法是缩小浏览器(ctrl+-),这是演示的链接 这是否可以通过html、css或javascript/jquery解决。 我已经为页面设置了响应标签: <meta name="viewport" content="width=device-width, initial-scale=1.0"> 这是图像div的html: <div class="c

该网站在iphone设备中显示图片时出现问题,通过水平最小化浏览器复制了该问题。
链接是否显示问题。
我的手动修复方法是缩小浏览器(ctrl+-),这是演示的链接

这是否可以通过html、css或javascript/jquery解决。
我已经为页面设置了响应标签:

    <meta name="viewport" content="width=device-width, initial-scale=1.0">  

这是图像div的html:

<div class="col-md-3 col-sm-3 col-xs-6 fabric-box">
    <a href="customize/fabric/<?php echo $x['hash'];?>/<?php echo $_SESSION['customize_mode'];?>">
    <div class="image-holder fabric-image-holder">
        <img data-src="<?php echo ap($x['thumb']);?>" class="lazy img-responsive" src="<?php echo $conf->bg;?>"></img>
    </div></a>
    <div class="row">
        <div class="col-md-12 col-sm-12 col-xs-12">
            <h5 class="fabric-name pull-left"><a href="customize/option_item/<?php echo $x['id'];?>"><?php echo $x['name']?></a></h5>
        </div>
        <div class="col-md-12 col-sm-12 col-xs-12">
            <h4 data-option-group="<?php echo $x['option_group_hash'];?>" data-toggle="tooltip" data-placement="top" title="" data-original-title="<?php echo $data_original_title;?>" id="wishlist-<?php echo $x['id']?>" class="wishlist-button pull-right">
                <span class="glyphicon <?php echo $glyphicon;?>"></span>
            </h4>
            <a href="customize/option_item/<?php echo $x['id'];?>" class="btn btn-declothe-gray btn-xs">Details</a>
        </div>
    </div>
</div>


我在您的HTML代码中看到了几个问题,因此其中一个问题可能是阻止iPhone正确显示页面。 例如,您的标记应如下所示:

<img data-src="https://d1r2cy10vhc364.cloudfront.net/1398340678_midnight-b_RGjA.jpg" 
class="lazy img-responsive" />
<img data-src="https://d1r2cy10vhc364.cloudfront.net/1398340678_midnight-b_RGjA.jpg" 
class="lazy img-responsive" src=""></img>

不是这样的:

<img data-src="https://d1r2cy10vhc364.cloudfront.net/1398340678_midnight-b_RGjA.jpg" 
class="lazy img-responsive" />
<img data-src="https://d1r2cy10vhc364.cloudfront.net/1398340678_midnight-b_RGjA.jpg" 
class="lazy img-responsive" src=""></img>

(换句话说,没有结束标记,而是在最后一个“>”之前添加斜杠,如html约定)

我还看到一个嵌套不正确的标记

你有这个:

                        <a href="customize/fabric/dItjZRcTuC/">
                        <div class="image-holder fabric-image-holder">
                            <img data-src="https://d1r2cy10vhc364.cloudfront.net/1398339227_midnight-b_rMUJ.jpg" class="lazy img-responsive" src=""></img>


                        </div></a>

但它应该是:

<div class="image-holder fabric-image-holder">
  <a href="customize/fabric/dItjZRcTuC/">
     <img data-src="https://d1r2cy10vhc364.cloudfront.net/1398339227_midnight-b_rMUJ.jpg" class="lazy img-responsive" />
  </div>
</a>


这些语法错误有时会造成一些问题,这些问题在某些浏览器上不会显示,但在其他浏览器上会显示。取决于标准合规性。您可以尝试在此处验证语法:

提供fiddle或您的网站链接,而不是提供Pngaded链接-