2010-08-20 3 views
0

У меня есть простой href, который вызывает функцию javascript, которая делает div скрытым и показывает другой, а не его. Затем я использую javascript, чтобы добавить какой-нибудь хороший эффект. Он отлично работает в Firefox и Chrome. В IE мне пришлось использовать ширину: 100%, чтобы заставить ее работать. И теперь он работает, он полностью разрушает мой тип шрифта. Вот код:Проблема с непрозрачностью в IE

Javascript:

function switch() 
{ 


if(document.getElementById("div1").style.visibility == "visible") 
{ 
    document.getElementById("div1").style.visibility = "hidden"; 
    document.getElementById("div1").style.display = "none"; 
    document.getElementById("div2").style.visibility = "visible"; 
    document.getElementById("div2").style.display = "block"; 
    initfade('div2'); 
} 
else 
{ 
    document.getElementById("div2").style.visibility = "hidden"; 
    document.getElementById("div2").style.display = "none"; 
    document.getElementById("div1").style.visibility = "visible"; 
    document.getElementById("div1").style.display = "block"; 
    initfade('div1'); 
} 
} 

function initfade(img) { 

    imageId = img; 
    image = document.getElementById(imageId); 
    setOpacity(image, 0); 
    image.style.visibility = 'visible'; 
    fadeIn(imageId,0); 
} 
function setOpacity(obj, opacity) { 
    opacity = (opacity == 100)?99.999:opacity; 

    // IE/Win 
    obj.style.filter = "alpha(opacity="+opacity+")"; 

    // Safari<1.2, Konqueror 
    obj.style.KHTMLOpacity = opacity/100; 

    // Older Mozilla and Firefox 
    obj.style.MozOpacity = opacity/100; 

    // Safari 1.2, newer Firefox and Mozilla, CSS3 
    obj.style.opacity = opacity/100; 
    } 

    function fadeIn(objId,opacity) { 
    if (document.getElementById) { 
     obj = document.getElementById(objId); 
     if (opacity <= 100) { 
      setOpacity(obj, opacity); 
      opacity += 30; 
      window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100); 
     } 
     if (opacity > 100) { 
     setOpacity(obj, 100); 
     }  
     } 
    } 

HTML:

<div id="div1" class="theStyle2_visible" style="visibility: visible;"> 
    <div id="normal" class="normal"> 
     <p>Example Text</p> 
    </div> 
</div> 
<div id="div2" class="theStyle2" > 
    <div id="normal" class="normal"> 
     <p>Example Text</p> 
    </div> 
</div> 
<a id="switchlink" href="javascript:switch();">Switch</a> 

CSS:

.theStyle2 { 
visibility: hidden; 
width: 100%; 
display: none; 
z-index: -1; 
    } 
    .theStyle2_visible { 
width: 100%; 
    } 
    #normal{ 
     font: 0.9em arial; 
     font-weight:400; 
     line-height: 20px; 
text-align:justify; 
    } 

у меня нет подумайте, что я делаю неправильно, и как это исправить, или если это всего лишь ошибка, но я пробовал миллион вещей и ничего не работает. Любая хорошая душа хочет мне помочь? пожалуйста!

спасибо.

EDIT: Прямая ссылка здесь: www.optimizer.pt/fade Если вы проверите его на firefox и IE, вы увидите, что я имею в виду. Я понятия не имею, что происходит ...

+0

Что вы подразумеваете под «руинами моего типа шрифта»? Можете ли вы подробнее объяснить, что пошло не так? –

+0

Я решил свои проблемы с IE, не имея понятия, что такое Alpha, используя jquery и пользовательские полосы прокрутки – Incognito

+0

, он просто теряет тип шрифта и размер, который был изначально. – user295744

ответ

0

Не знаете, в чем проблема, но когда вы говорите «разрушает мой тип шрифта»: Можете ли вы дать элемент, который увядает с цветом фона? Это часто помогает.

+0

Я уже пробовал, но это не помогло. Я действительно не знаю, в чем проблема. Это что-то действительно странное. Это я тоже не знаю, как это решить ... – user295744

Смежные вопросы