-1

我对编程很陌生,但我正在尝试找到一种方法来执行下面描述的操作。

<body>

<div class="gallery">

<img src="photo_1.jpg">
<img src="photo_2.jpg">
<img src="photo_3.jpg">

<!-- trigger for user to load items that weren't downloaded on page load -->
<img src="photo_4.jpg">
<img src="photo_5.jpg">
<img src="photo_6.jpg">

</div>

</body>

我正在尝试找到PHP函数,理想情况下,这些函数只会在某个class/ID中加载前 3 个img嵌入,并有一个可点击的触发器来从服务器请求剩余的img嵌入。

我不知道这是否是典型的留言板软件(例如vBulletin)处理带有“剧透标签”的事情的方式......就像它是否真的阻止加载,或者只是隐藏了内容。像这样的东西,如果它真的阻止加载,就是我想知道的。

4

1 回答 1

0

首先,这与 PHP 无关。

阻止页面加载图像的唯一方法是不在页面上包含标签。

您可以通过以下几种方式完成此操作:

将最后三张照片放在一个隐藏的容器中,并在需要时使用 Javascript click 事件显示它们,但在加载页面时仍会加载图像。

或者,您可以使用 AJAX 调用仅按需检索项目。除非它们是非常大的图像,否则我认为第一个选项是最好的。

<div class="gallery">
    <img src='photo1.jpg'/>
    <img src='photo2.jpg'/>
    <img src='photo3.jpg'/>
    <a href="#" onClick='document.getElementById("hidden-gallery").display="visible"'>show more</a>
    <div id="hidden-gallery" class="hidden-gallery" style="display:none">
        <img src='photo4.jpg'/>
        <img src='photo5.jpg'/>
        <img src='photo6.jpg'/>
    </div>
</div>

我认识到以我的方式嵌入 CSS 样式和 Javascript 不是首选方法,但它只是为了示例而存在。

于 2013-09-06T18:37:10.740 回答