Создание размыло изображение PNG для наложения по текстовой ссылке
У меня есть веб-сайт, где я хочу, чтобы текстовые ссылки в навигации были размыты. Когда посетитель затем нависает над текстовой ссылкой, это становится ясным снова.
Моя идея состоит в том, чтобы сделать некоторое размытое изображение в формате PNG для наложения по текстовой ссылке.
Я попытался сделать это, но мои навыки Photoshop являются noobish. Я мог сделать тот, потому что размытый белый не работает :s
- Как Вы создали бы такое изображение?
- У Вас есть другое решение?
3 ответа
Нет никакого способа создать (полу-) прозрачное изображение PNG, которое размоет то, что оно накладывает. Это просто не может быть сделано. Если Вам действительно нужен динамический веб-сайт, таким образом, можно легко изменить текст, я рекомендовал бы использовать Сценарий PHP как ниже для размывания изображения. Это прибывает отсюда. Вы могли использовать другой Сценарий PHP для генерации текстового изображения.
Результат:
<?php
function blur (&$image) {
$imagex = imagesx($image);
$imagey = imagesy($image);
$dist = 2;
for ($x = 0; $x < $imagex; ++$x) {
for ($y = 0; $y < $imagey; ++$y) {
$newr = 0;
$newg = 0;
$newb = 0;
$colours = array();
$thiscol = imagecolorat($image, $x, $y);
for ($k = $x - $dist; $k <= $x + $dist; ++$k) {
for ($l = $y - $dist; $l <= $y + $dist; ++$l) {
if ($k < 0) { $colours[] = $thiscol; continue; }
if ($k >= $imagex) { $colours[] = $thiscol; continue; }
if ($l < 0) { $colours[] = $thiscol; continue; }
if ($l >= $imagey) { $colours[] = $thiscol; continue; }
$colours[] = imagecolorat($image, $k, $l);
}
}
foreach($colours as $colour) {
$newr += ($colour >> 16) & 0xFF;
$newg += ($colour >> 8) & 0xFF;
$newb += $colour & 0xFF;
}
$numelements = count($colours);
$newr /= $numelements;
$newg /= $numelements;
$newb /= $numelements;
$newcol = imagecolorallocate($image, $newr, $newg, $newb);
imagesetpixel($image, $x, $y, $newcol);
}
}
}
echo "Image before blurring: <img src=\"blurimg.jpg\" /><br /><br />";
$im = imagecreatefromjpeg("blurimg.jpg");
blur($im);
imagejpeg($im, "blurimg2.jpg");
echo "Image blurred: <img src=\"blurimg2.jpg\" /><br />";
imagedestroy($im);
?>
Что я сделал бы, вот, создают текстовую кнопку и затем используют фильтр или эффект в Infranview (Только бесплатное программное обеспечение, AFIAK, Windows) для сохранения копии с наложенным эффектом, таким образом, у Вас были бы image1.png и image1blurred.png (как пример). Затем Вы создали бы динамический эффект, таким образом, подпиленный показывают все время если Вы трансформация он.
Кроме того,>, почему <Вы хотели бы сделать это?
Необходимо смочь сделать заливку чистых белых и установить прозрачность слоя меньше чем на 100%.