Question

我创建了一个页面，其中显示了11个图像，其大小和位置是随机设置的（通过PHP到CSS）。我希望当你点击一个图像时，它会引导你到另一个，等等。我想我可以用锚点做到这一点，但它似乎不起作用，或至少工作不好。我可能以一种糟糕的方式做到了这一点，我在编码方面根本不是专家：s

以下是页面：www.paulchapellier.fr/15/index.php

我为图像的大小和位置设置了一个多数组，然后是一个foreach来制作CSS。

这是数组：

$tab= array( array (
      id => "1",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),
    ),
                array(
        id => "2",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    ),
                array(
        id => "3",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    ),
                array(
        id => "4",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    ),
                array(
        id => "5",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    ),
                array(
        id => "6",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1500),   
    ),
                array(
        id => "7",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1500),   
    ),
                array(
        id => "8",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    ),
                array(
        id => "9",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    ),
                array(
        id => "10",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    ),
                array(
        id => "11",
        left => mt_rand(1, 3900),
        top => mt_rand(1, 2950),
        width => mt_rand(150, 1000),   
    )
    );

这是foreach和CSS：

    <style type="text/css">

    <?php
    foreach ($tab as $tab1) {
                    echo".image".$tab1['id']."{
                    width: ".$tab1['width']."px;
                    position: absolute;
                    }\n";
            }

    foreach ($tab as $tab1) {
                    echo"#posimage".$tab1['id']."{
                    position: absolute;
                    display: inline;
                    left: ".$tab1['left']."px;
                    top: ".$tab1['top']."px;
                    float: left;
                    border: 0px solid red;
                    }\n";
            }

    ?>
    body {
        width: auto;
        height: auto;
    }

    a:hover, active img {
        position: absolute;
        display: inline;
        z-index: +20;
    }


    </style>

这是图像和锚点：

<div id="posimage1"><a href="#posimage2"><img src="http://paulchapellier.fr/15/img/08/01.jpg" class="image1" alt="1"></a></div>
     <div id="posimage2"><a href="#posimage3"><img src="http://paulchapellier.fr/15/img/08/02.jpg" class="image2" alt="2"></a></div>

继续到11.jpg。希望我足够清楚谢谢！保罗

锚点工作错误（位置随机设置）

0 个答案: