开发者

I have custom Javascript fadein function which looses cleartype of text after effect fadein in IE 7

开发者 https://www.devze.com 2023-02-02 13:02 出处:网络
Sorry guys.. I am not familiar with JavaScript anymore but I need to add clear type which can make text anti-aliased in IE7. I found some similar questions but. the problem is I don\'t know the right

Sorry guys.. I am not familiar with JavaScript anymore but I need to add clear type which can make text anti-aliased in IE7. I found some similar questions but. the problem is I don't know the right place to paste the code I get.

My script as follow

// JavaScript Document
var CurrentDivIndex=0;
var TimeOutValue;
var btn;
var TimeToFade = 1000.0;
function ShowDivSlideShow()
{
 try 
 {
  if(CurrentDivIndex == 5)
   CurrentDivIndex=0;

  CurrentDivIndex++;  
  //alert("Banner" + CurrentDivIndex);
  //alert(CurrentDivIndex);
  var Indexer=1;
  while(Indexer<6)
  {


   var DivToShow=document.getElementById("Banner" + Indexer);
   DivToShow.style.display = "none";
   btn=document.getElementById("btnb" + Indexer);
   btn.setAttribute("class","none");

      Indexer++;

  }



  var DivToShow=document.getElementById("Banner" + CurrentDivIndex);
  DivToShow.style.display = "block";
  btn=document.getElementById("btnb" + CurrentDivIndex);
  btn.setAttribute("class","activeSlide");
//  btn.className="activeSlide";
  fadeIn();
  TimeOutValue=setTimeout("ShowDivSlideShow()",6000);

 }
 catch(err)
 {
  alert(err)
 }
}



function ShowCustomDiv(CurrentDivIndexRec)
{

 clearTimeout(TimeOutValue)
 CurrentDivIndex=CurrentDivIndexRec

  var Indexer=1;
 while(Indexer<6)
 {
  if(CurrentDivIndex==Indexer)
  {
   Indexer++;
   continue;
  }

  var DivToShow=document.getElementById("Banner" + Indexer);
  DivToShow.style.display = "none";
  btn=document.getElementById("btnb" + Indexer);
   btn.setAttribute("class","none");
     Indexer++;

 }

 var DivToShow=document.getElementById("Banner" + CurrentDivIndex);
  DivToShow.style.display = "block";
  btn=document.getElementById("btnb" + CurrentDivIndex);
  btn.setAttribute("class","activeSlide");
  btn.className="activeSlide"
  fadeIn();
}


function ShowDivSlideShowWithTimeOut(CurrentDivIndexRec)
{

 clearTimeout(TimeOutValue)
 CurrentDivIndex=CurrentDivIndexRec;
 var Indexer=1;
  while(Indexer<6)
  {
  if(CurrentDivIndex==Indexer)
  {
   Indexer++;
   continue;
  }

  var DivToShow=document.getElementById("Banner" + Indexer);
  DivToShow.style.display = "none";
  btn=document.getElementById("btnb" + Indexer);
  btn.setAttribute("class","none");
  Indexer++;

  }


 var DivToShow=开发者_开发百科document.getElementById("Banner" + CurrentDivIndexRec);
  DivToShow.style.display = "block";
  btn=document.getElementById("btnb" + CurrentDivIndexRec);
  btn.setAttribute("class","activeSlide");


 TimeOutValue=setTimeout("ShowDivSlideShow()",6000);
}

function ShowCustomDivOnClick(CurrentDivIndexRec)
{

 clearTimeout(TimeOutValue)
 CurrentDivIndex=CurrentDivIndexRec;

  var Indexer=1;
  while(Indexer<6)
  {
  if(CurrentDivIndex==Indexer)
  {
   Indexer++;
   continue;
  }

  var DivToShow=document.getElementById("Banner" + Indexer);
  DivToShow.style.display = "none";

  btn=document.getElementById("btnb" + Indexer);
  btn.setAttribute("class","none");
     Indexer++;

  }


 var DivToShow=document.getElementById("Banner" + CurrentDivIndexRec);
  DivToShow.style.display = "block";

  btn=document.getElementById("btnb" + CurrentDivIndexRec);
  btn.setAttribute("class","activeSlide");

  fadeIn();
 TimeOutValue=setTimeout("ShowDivSlideShow()",6000);
}

function setOpacity(level) {
  element=document.getElementById("Banner" + CurrentDivIndex);
  element.style.opacity = level;
  element.style.MozOpacity = level;
  element.style.KhtmlOpacity = level;
  element.style.filter = "alpha(opacity=" + (level * 100) + ");";
}

var duration = 300;  /* 1000 millisecond fade = 1 sec */
var steps = 10;       /* number of opacity intervals   */
var delay = 6000;     /* 5 sec delay before fading out */

function fadeIn(){
  for (i = 0; i <= 1; i += (1 / steps)) {
    setTimeout("setOpacity(" + i + ")", i * duration);
  }
 // setTimeout("fadeOut()", delay);
}

function fadeOut() {
  for (i = 0; i <= 1; i += (1 / steps)) {
    setTimeout("setOpacity(" + (1 - i) + ")", i * duration);
  }
  setTimeout("fadeIn()", duration);
}

//end of script

Now I am very confused where to add :

$('#slideshow').cycle({ 
    cleartype:  1 // enable cleartype corrections 
});

or

$('#fadingElement').fadeIn(2000, function(){
 $(this).css('filter','');
});

so it will work... Please Help me...


This is easy. Just replace all of your text with pre-rendered versions. If your site has a fixed-width layout, take a screenshot of it and embed the image in your page. Using pre-rendered images is always the clear and definitive solution.

0

精彩评论

暂无评论...
验证码 换一张
取 消