Criando uma imagem PNG desfocada para colocar sobre o link de texto

Question

Eu tenho um site onde eu quero que os links de texto na navegação sejam borrados. Quando o visitante passa o mouse sobre o link de texto, fica claro novamente.

Minha ideia é fazer algum tipo de imagem borrada no formato PNG para colocar sobre o link de texto.

Eu tentei fazer isso, mas minhas habilidades no Photoshop são noobish. Eu poderia fazer um porque o branco borrado não funciona: s

• Como você criaria essa imagem?
• Você tem outra solução?

Answer 1

Não há como criar uma imagem PNG (semi-) transparente que desfocará o que estiver sobreposta. Isso simplesmente não pode ser feito. Se você realmente precisa de um site dinâmico para poder alterar facilmente o texto, recomendo usar um script PHP como o abaixo para desfocar uma imagem. Vem de aqui . Você poderia usar outro script PHP para gerar a imagem de texto.

Resultado:

<?phpfunctionblur(&$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($coloursas$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);
?> 

    

Answer 2

O que eu faria aqui é criar o botão de texto e usar um filtro ou efeito no Infranview (Freeware, AFIAK, Windows somente) para salvar uma cópia com o efeito sobreposto, então você teria image1.png e image1blurred. png (como exemplo). Então, você criaria um efeito de rolagem para que a peça seja mostrada o tempo todo, a menos que você a role.

Além disso, > por que < você gostaria de fazer isso?

    

Answer 3

Você deve conseguir fazer um preenchimento de branco sólido e definir a transparência da camada para menos de 100%.