php - iPad 和 iPhone 上未显示 body 背景图片

Question

我创建了一个在桌面上运行良好的网站，但在 iPhone 和 iPad 上无法显示背景图像。

我尝试删除选择图像的 php 脚本并重新编写代码以使用 javascript 设置背景，在这种情况下背景显示正确。

这是选择图片的php代码:

<?php
//if  doesn't exist, open the session
if(!isset($_SESSION))
{
    session_start();
}
//set coockie
setcookie("allweb","connected", time()+3600);
//if doesn' exist yet, I create a new array
if(!isset($_SESSION['arrayImage'])){
    $arrayImage = array(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15);
}else{// else I get from sessiom
    $arrayImage = $_SESSION['arrayImage'];  
}
//if already exist variable $picture, increment it
if(isset($_SESSION['picture']) && isset($arrayImage)){
    $picture=$_SESSION['picture'];
    $picture = $picture + 1;
    $_SESSION['picture'] = $picture;//save picture
}else{// else I create it
    $picture = 1;
    $_SESSION['picture'] = $picture;// save it
    shuffle($arrayImage);// I shuffle the array
    $_SESSION['arrayImage'] = $arrayImage;//save array to the session
}
?>

在 php 页面中，我在样式标签之间有这段代码:

<style type="text/css">
<?php 
if($picture < 15){//if I'm not out fo bound I continue
    echo 'body {background-image:url("images/bg'.$arrayImage[$picture].'hq.jpg");}';
}
else{// else I set picture to default value and restar the loop.
    $picture = 0;
    $_SESSION['picture'] = $picture;// save it
    echo 'body {background-image:url("images/bg'.$arrayImage[$picture].'hq.jpg");}';
}       
?>      
</style>

问题是图像没有立即显示，但我必须缩放页面然后它们才会显示。

Answer 1

我假设您已经检查了输出并且它是正确的。如果是这种情况，请尝试从背景 url 周围删除引号:

body {background-image:url("images/bg'.$arrayImage[$picture].'hq.jpg");}

到

body {background-image:url(images/bg'.$arrayImage[$picture].'hq.jpg);}

顺便说一句，使用它们是绝对有效的，但这种情况非常罕见，而且 iOS 的 Webkit 渲染器有时喜欢产生一些错误的结果，即使使用有效标记也是如此。不幸的是，它不同于 Android 的 Webkit 渲染器或任何 x86 Webkit 引擎，因此如果没有非常昂贵的 Apple 设备，这些问题将无法重现和深入检查。

使用 JS，特别是框架(例如 jQuery)完成的 CSS 修改通常会被智能地解析，从而在需要时进行语法更正，所以这就是为什么我主要怀疑这些引号。