Borda Redonda e Opacidade

[Bru_ce 53]

Boa Tarde,

estou com um problema desde a manhã e não consigo resolver, por causa do filho da P... do IE.

 

 

Seguinte, tenho uma div assim:

 

.centro .esquerda {
width: 490px;
background-image:url(background.png);
float: left;
       border-radius:18px;
       opacity:0.5;
height:610px;
padding:20px;
}

 

Nos navegadores atuais funciona, porém quando vai para o nojento do IE não funciona,

 

já tentei fazer com jQuery corner a borda e não rolou

Já tentei também incluir o arquivo HTC, porém ele da conflito com a opacidade..

Na opacidade estou usando isso e funciona, porém preciso de borda redonda e opacidade,

Pensei em utilizar imagem, porém não seria interessante ..

 

opacity: 0.6;
-moz-opacity: 0.6;
-khtml-opacity: 0.6;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
filter: alpha(opacity=60);

[William Bruno 1501]

a borda redonda pode esquecer cara.. só com imagens você vai conseguir fazer funcionar no ie.

[Bru_ce 53]

Entendi ..

Mais porque dá esse conflito william ?

 

Ou funciona o HTC ou funciona a borda, os dois não dá ..

[William Bruno 1501]

não sei cara.. não faz muito sentido na verdade.

 

o htc é um javascript. Tem q ver oq ele tá fazendo. Pode abrir com um editor de texto.

[Bru_ce 53]

não sei cara.. não faz muito sentido na verdade.

 

o htc é um javascript. Tem q ver oq ele tá fazendo. Pode abrir com um editor de texto.

 

 

entendi, teria como me ajudar william ..

[Kaue Machado 0]

Pra opacidade no IE <= 8 você precisa de um filtro do IE:

 

filter: alpha(opacity = X);

X = um valor de 0 a 100 (a porcentagem, mas sem o "%" no fim)

 

Cara, ja a borda redonda no IE é um mistério eterno. O já desenvolvi projetos com CSS3PIE que funcionou perfeitamente, já em outros nunca funcionou. Dica: Algumas das vezes em que o .htc não funcionava era pelo endereço, tente mudar o local do arquivo usando ou não usando o "../" antes.

 

Devo ter um projeto que fiz com PIE nas profundezas do meu HD, hoje em dia não dou muita atenção aos ltIE8, mas se precisar depois procuro pra te mostrar como fiz.

 

Achei o projeto, da uma olhada nesse elemento que tem propriedades CSS3:

.topo{
   width: 960px;
   height: 440px;
   float: left;
   display: block;
   position: relative;
   box-shadow: 3px 3px 10px #000;
   behavior: url(PIE/PIE.htc);
   border-radius: 10px;
   background: #1e5799;

 

Nesse projeto eu tenho uma pasta "PIE", na raiz do site e dentro dela tenho o arquivo "PIE.htc".

Todas as propriedades que estão no css desse elemento funcionam, a unica coisa que não funcionou foi o gradient, não sei bem porque.

[Bru_ce 53]

Fala Kaue, obrigado pela ajuda.

Eu até consegui cara, o problema é que dá conflito quando tento usar o HTC com o filtro ..

[Kaue Machado 0]

Você pode tentar fazer isso usando jquery, mas eu acho que o resultado vai ser o mesmo porque o jquery só vai manipular o filtro e o opacity, até onde sei pelo menos...

 

Mas se quiser tentar...

$(document).ready(function(){
  $('.elemento').fadeTo(0.5);
});

[Gilberto Jr 26]

A borda arrendoda você pode fazer via javascript[JQuery]. Da um pesquisada ai que você encontrar.

 

<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="js/curvycorners.src.js"></script>

<script type="text/javascript" language="javascript">
addEvent(window, 'load', initCorners);

 function initCorners() {
   var settings = {
     tl: { radius: 20 },//valor que você quer colocar no arrendondamento
     tr: { radius: 20 },//valor que você quer colocar no arrendondamento
     bl: { radius: 20 },//valor que você quer colocar no arrendondamento
     br: { radius: 20 },//valor que você quer colocar no arrendondamento
     antiAlias: true
   }
   curvyCorners(settings, "#conteudo");
}
</script>

[Bru_ce 53]

Já desisti cara, o trabalho foi feito com opacidade normal com os filtros e sem border radius !