Question

我正在制作一个有很多照片的网站。当用户点击特定照片时，将加载新页面，该照片显示的尺寸更大。有一个下一个按钮，将用户带到另一个页面，其中有另一张照片。因此，我的网站将有很多子网页（比我在网站上的照片数量多一点）。通常这些网站是如何制作的，即有很多网页，还是有其他替代方案？

Answer 1

如果您有1个html页面，那么您可以使用某种案例系统在正文中编写PHP include 'photographlink'。它将使用1个html页面，它将包含一张不同的照片，具体取决于点击的照片

http://www.php.net/manual/en/function.include.php

Answer 2

我认为更好的方法是使用javascript，我的提示是使用jQuery框架动态加载和可视化图像。你可以在网上找到一些可以简化生活的插件。

demo of one plugin

Answer 3

不，这不是通常的方法，至少在这些日子里。当我们遇到类似你的情况时，我们通常会尝试让它变得动态。例如，如果您需要使用相同的标记和格式显示大量照片，可能最好的选择是使用带有变量的模板。变量将是照片网址，模板将是它周围的一切。页面是相同的，但只有照片更改。这样做有很多好处。维护，简单，工作负载，缓存...

当然，这可以在另一种情况下使用，例如查看新的详细信息，当您只有一个ViewNew页面，并且您传递一个带有新标识符的参数，这样您就可以显示正确的请求。

有很多方法可以实现这一点，大多数都需要服务器端代码来处理和处理请求，例如：

但是，其中一些操作也可以通过客户端脚本代码javascrip实现。您可以使用纯JavaScript或使用框架使事情变得简单和兼容。以下是javascript框架的一些示例：

我不知道您是否想要使用其中一种语言的特定示例，或者只知道替代方案。如果您需要示例或需要更多信息，我很乐意提供一些。此外，即使您使用服务器端代码也使用javascript也很常见，因为它可以处理网站上的行为和/或ajax请求异步请求。

实施例

JavaScript简单： jsFiddle

HTML：

<div>
    <button id="previous" onClick="previousImg();">Previous</button>
    <button id="next" onClick="nextImg();">Next</button>
</div>
<div>
    <img id="imgViewer" src="http://icons.iconarchive.com/icons/mattahan/umicons/256/Number-1-icon.png" />
</div>

JavaScript的：

var imgUrlTemplate = 'http://icons.iconarchive.com/icons/mattahan/umicons/256/Number-$number$-icon.png';

var imgCounter = 1;
var imgViewerNode = document.getElementById("imgViewer");

function previousImg() {
    if(imgCounter > 1) {
        imgCounter--;
        imgViewerNode.src=imgUrlTemplate.replace("$number$",imgCounter);
    }
}

function nextImg() {
    if(imgCounter < 9) {
        imgCounter++;      imgViewerNode.src=imgUrlTemplate.replace("$number$",imgCounter);
    }
}

我的网站包含很多子页面，这是常见的做法还是有替代方案？

3 个答案:

实施例