README

概述

SimpleImage PlaceHolder 类允许您自行托管一个随机图像占位符引擎，用真实的随机图像而不是无聊的灰色方块填充您正在开发的网站和原型。此类扩展了 Cory LaViska 的 SimpleImage，旨在帮助网页开发者生成临时的随机占位图图像。

您可以使用自己的图像或任何免费提供的创意共享图像。您可以使用您喜欢的数量——显然，您使用的越多，引擎就越随机、多样化。您使用的尺寸、宽高比或方向无关紧要，PlaceHolder 会计算出生成占位图图像的最佳匹配。

要求

PHP 5.6+
SimpleImage (Composer 应该会处理这个)

安装

使用 Composer 安装 PlaceHolder

composer require seydoggy/placeholder

入门

示例文件夹包含一个 .htaccess 文件、一个图像文件夹和一个 index.php 文件。
将这些文件复制到您的域名/子域名的公共位置。
使用 composer 安装 PlaceHolder
```
composer require seydoggy/placeholder
```

注意：.htaccess 和 index.php 只包含足够的设置，以便您开始，文件夹名称、路径和命名空间是任意的。请将它们视为您需要的最基本示例，但绝非固定不变。根据您当前的设置更改路径和命名空间。如果您对这一切都相当陌生，在尝试在主域名的文件夹中运行之前，考虑在专用子域中单独运行 PlaceHolder。

使用方法

基础

使用至少两个参数请求您的新 PlaceHolder 引擎——宽度然后是高度——由破折号分隔。例如，http://image.domain.url/600-400。

在 HTML img 标签中，它看起来像这样

<img src="http://image.domain.url/600-400" alt="some random image">

或者 CSS 背景看起来像这样

.header {
    background: #000 url(http://image.domain.url/960-200) center center no-repeat;
}

有趣的小技巧

还有一个可选的第三个参数，可以对生成的图像进行一些修改。

介绍方形图像处理，示例

<img src="http://image.domain.url/400" alt="some random image">

bw 将随机图像渲染为黑白

<img src="http://image.domain.url/600-400-bw" alt="some random image">

sepia 将随机图像渲染为棕褐色

<img src="http://image.domain.url/600-400-sepia" alt="some random image">

sketch 将随机图像渲染为具有锐化效果的草图效果（一般般）
```
<img src="http://image.domain.url/600-400-sketch" alt="some random image">
```
pixelate 将随机图像渲染为像素化到无法识别的程度（相当酷）
```
<img src="http://image.domain.url/600-400-pixelate alt="some random image">
```

random 将随机图像渲染为上述任何一种效果

<img src="http://image.domain.url/600-400-random" alt="some random image">

避免重复

您可能会在同一页面上对同一尺寸的图像进行多次请求。如果请求是相同的，则图像也将是相同的。解决这个问题的一个简单方法是通过第三个甚至第四个参数使每个请求都是唯一的。第三个参数可以是任何受支持的密钥词，也可以是任何自定义标识符。如果您使用受支持的密钥词，则可以使用任何自定义标识符作为伪第四个参数。

以下示例都将渲染独特的图像，所有图像都具有相同的 200px X 100px 尺寸

<img src="http://image.domain.url/200-100" alt="some random image">
<img src="http://image.domain.url/200-100-0" alt="some random image">
<img src="http://image.domain.url/200-100-0-1" alt="some random image">
<img src="http://image.domain.url/200-100-small" alt="some random image">
<img src="http://image.domain.url/200-100-small2" alt="some random image">
<img src="http://image.domain.url/200-100-small-2" alt="some random image">
<img src="http://image.domain.url/200-100-bw" alt="some random image">
<img src="http://image.domain.url/200-100-bw-small" alt="some random image">
<img src="http://image.domain.url/200-100-random" alt="some random image">
<img src="http://image.domain.url/200-100-random-1" alt="some random image">

同样，以下的所有CSS示例都将渲染独特的图像，所有图像的尺寸都是相同的960像素 X 200像素

.slider1 {
    background: #000 url(http://image.domain.url/960-200-slider-1) center center no-repeat;
}
.slider2 {
    background: #000 url(http://image.domain.url/960-200-slider-2) center center no-repeat;
}
.slider3 {
    background: #000 url(http://image.domain.url/960-200-slider-3) center center no-repeat;
}
.slider4 {
    background: #000 url(http://image.domain.url/960-200-slider-4) center center no-repeat;
}
.slider5 {
    background: #000 url(http://image.domain.url/960-200-slider-5) center center no-repeat;
}

查看实际效果

我为PlaceHolder创建了一个特别的页面，让您可以查看其实际效果。页面上的每一张图片（包括顶部的滑块）都是使用PlaceHolder生成的。每个示例下方是请求每张图片所使用的代码。下载并运行示例网站，查看详情！

贡献力量！

我喜欢在PHP上动手脚，但绝不是专家。我已尽力遵循我认为最好的phpdoc、命名空间和整体面向对象编程实践，但我明白我的代码中可能还有很大的改进空间。所以请帮助我，分支代码，提交拉取请求，提交错误报告，等等...如果您使用此代码，请分享您的想法。

seydoggy / placeholder

维护者

详细信息