Transformar LI em link

Só colocar o a dentro dele.

<ul class="kwicks" >
 <li id="kwick_1"><a href="#">conteúdo</a></li>
 <li id="kwick_2"><a href="#">conteúdo</a></li>
 <li id="kwick_3"><a href="#">conteúdo</a></li>
 <li id="kwick_4"><a href="#">conteúdo</a></li>
</ul>Você quer apresentar uma lista com imagens? Então seria pra fazer assim: 

<ul class="kwicks" >
 <li id="kwick_1"><a href="#"><img src="[caminho da imagem] alt="[texto alternativo] /></a></li>
 <li id="kwick_2"><a href="#"><img src="[caminho da imagem] alt="[texto alternativo] /></a></li>
 <li id="kwick_3"><a href="#"><img src="[caminho da imagem] alt="[texto alternativo] /></a></li>
 <li id="kwick_4"><a href="#"><img src="[caminho da imagem] alt="[texto alternativo] /></a></li>
</ul>

Olá Thiago...

Na verdade gostaria que o próprio LI fosse o link...

Sem colocar nada dentro dele.

Dá pra fazer?

ZUCOLLI

Usando Javascript você consegue..

mas qual o motivo ?

Olá...

Cada um destes LI terá uma imagem de fundo e não terá nada dentro, mas será link...

ZUCOLLI

Uma forma, para te dar idéia:

<li id="kwick_1" onclick="window.open('http://www.google.com.br');" style="cursor: pointer;"></li>
Mas isso vai ficar bem estranho hein?! ignora uma boa quantidade de recomendações, de usabilidade, acessibilidade..

E por que não colocar como eu apresentei? Algum motivo especial?

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Use display:block pro a ocupar todo o li.

É realmente com o window.open acho que não seria uma boa...

E se não descobrir uma maneira de linkar o LI, vou acabar fazendo com a imagem mesmo...

ZUCOLLI

Ainda não entendi o objetivo... Se explicar qual, quem sabe eu possa ver uma solução melhor.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Pq eu vou chamar um background-image dinamicamente com PHP em LIs, para montar um menu, e se eu colocar a imagem o usuário consegue arrastar a imagem e se colocar como bkg ele não consegue, mas não sei como fazer o link.

ZUCOLLI

Se a intenção for com que ele não salve a imagem, não vai ter como. Um simples "Salva imagem como..." e ferra tudo.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Na verdade não.

É só pq o menu ficará um pouco grande e se o usuario não consegue arrastar com a imagem em bkg.

ZUCOLLI

Rapaz, não tem sentido fazer como quer...

Insira o link normalmente dentro da LI como o Thiago sugeriu e deixe o link sem fundo (já é o padrão)...

Aí na lista você põe o fundo que quer...

OK. Obrigado.

Vou fazer como o Thiago indicou, que é como eu já estava fazendo.

Obrigado a todos.

ZUCOLLI

Dexa eu ver se entendi, você quer proteger as imagens dos links contra roubo??

Bom, existe uma maneira de proteger contra o roubo prático (botão direito, salvar como). Mas ainda existe a possiblidade de algum ser paciente ler o seu CSS, descobrir o caminho da imagem e abrir para baixar (aí você tem que utilizar .htaccess para proteger). Depois de utilizar .htaccess, se suas imagens forem muito f*das mesmo!!! OMG! e o cara estiver MESMO a fim de roubá-las, basta abrir os arquivos temporários do browser, organizar por endereço e copiá-las para outro lugar

para proteger contra o roubo prático, faça assim:

<ul class="menu">
 <li id="link1"><a href="local1.html"><img src="imagem_transparente.png" alt="local 1" /></a></li>
 <li id="link2"><a href="local2.html"><img src="imagem_transparente.png" alt="local 2" /></a></li>
 <li id="link3"><a href="local3.html"><img src="imagem_transparente.png" alt="local 3" /></a></li>
 <li id="link4"><a href="local4.html"><img src="imagem_transparente.png" alt="local 4" /></a></li>
 <li id="link5"><a href="local5.html"><img src="imagem_transparente.png" alt="local 5" /></a></li>
</ul>

css
.menu li, .menu img { height: [altura]px; width: [largura]px; }
#link1 { background: url(imagem_do_link_1.jpg); }
#link2 { background: url(imagem_do_link_2.jpg); }
#link3 { background: url(imagem_do_link_3.jpg); }
#link4 { background: url(imagem_do_link_4.jpg); }
#link5 { background: url(imagem_do_link_5.jpg); }

[edit]Para impedir o download das imagens (e impedir que o usuário as pegue da pasta temporária) declare:

<meta http-equiv="pragma" content="no-cache" />

Não... Era só para o usuário não conseguir arrastar a imagem.

ZUCOLLI

Ué, colocando como Background no LI não dá pra arrastar, daí você coloca o texto do link no LI, linka ele, e adiciona display:block no A, e coloca as medidas, pra ocupar todo o LI... Não testei, mas acho que assim funciona...

>
Não... Era só para o usuário não conseguir arrastar a imagem.

ZUCOLLI

Nunca vi isso.

>

>

Não... Era só para o usuário não conseguir arrastar a imagem.

ZUCOLLI

Nunca vi isso.

Acho que o que ele quis dizer é a "aquele" efeito de pegar e arrastar a imagem e depois que solta ela vai voltando. mas pode arrastar para a área de trabalho para salvar a imagem.

Em fim, se o cara estiver mesmo disposto a pegar a imagem, um PrintScreen resolve a vida dele.

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Pelo que entendi, o usuário não falou nada sobre roubar/salvar a imagem, ele falou sobre arrastar... Quando clica em cima, segura, e move... Com a imagem em background isso não acontece...