ร่วมด้วยช่วยกัน Say No To IE 6! สำหรับเว็บที่ใช้ jQuery (และพวก Prototype JavaScript ตัวอื่น ๆ ด้วย)

จาก entry หมดเวลา Internet Explorer 6 แล้ว เลิกใช้มันได้แล้ว !!! และจาก Campaign “Say No To IE 6!” จากเว็บ SaveTheDevelopers.org นั้นเค้าให้เอา code ด้านล่างนี้ไปใส่

แต่ถ้าเว็บใครใช้ jQuery นี่อาจจะไม่ได้ แบบ Theme K2 ของผม วิธีอีกแบบที่สามารถทำได้ และทำงานร่วมกับ jQuery ได้ก็คือใช้ CSS – Conditional comments นั้นเอง โดยกำหนดไว้ว่าถ้า IE ที่ version น้อยกว่า 7 ให้โชว์ตัว popDown นี้ขึ้นมาครับผม

  1. <!--[if lt IE 7]>
  2. < ![endif]-->

เสร็จแล้วในไฟล์ savethedevelopers.js ก็ปรับแก้เป็นแบบนี้ครับ

javascript

  1. jQuery(document).ready(function(){
  2.     var now = new Date();
  3.     var time = now.getTime();
  4.     var div = document.createElement('a');
  5.     var id = 'saynotoie6_div_' + time;
  6.     div.setAttribute('id',id);
  7.     div.setAttribute('href','http://www.savethedevelopers.org/');
  8.     div.setAttribute('target','_blank');
  9.     div.style.display = 'block';
  10.     div.style.color = '#1d1d1d';
  11.     div.style.textAlign = 'left';
  12.     div.style.fontFamily = 'Arial';
  13.     div.style.fontSize = '11px';
  14.     div.style.background = 'url(http://webhost.domain/path/to/savethedevelopers/PopDown.gif)';
  15.     div.style.padding = '0';
  16.     div.style.position = 'absolute';
  17.     div.style.top = '0';
  18.     div.style.right = '40px';
  19.     div.style.zIndex = '999999';
  20.     div.style.width = '330px';
  21.     div.style.height = '63px';
  22.     div.style.marginTop = '-80px';
  23.     div.style.filter = 'alpha(opacity=95)';
  24.     document.body.appendChild(div);
  25.    
  26.     var animate = function(){
  27.         var myDiv = document.getElementById(id);
  28.         var value = parseInt(myDiv.style.marginTop)
  29.         myDiv.style.marginTop = value + 1 + 'px';
  30.         if(parseInt(myDiv.style.marginTop) < -1){
  31.             var timer = setTimeout(animate,30 * 80/Math.abs(value) * .27);
  32.         }else{
  33.             var timer = setTimeout(hide,25000);
  34.         }
  35.     }
  36.    
  37.     var hide = function(){
  38.         var myDiv = document.getElementById(id);
  39.         var value = parseInt(myDiv.style.marginTop)
  40.         myDiv.style.marginTop = value - 1 + 'px';
  41.         if(parseInt(myDiv.style.marginTop) > -80){
  42.             var timer = setTimeout(hide,1.4 * 80/Math.abs(value) * 3.70);
  43.         }
  44.     }
  45.    
  46.     setTimeout(animate,1000);
  47. });

ลองเทียบกับของเก่าเค้าก็ได้นะครับ อันนี้ผมปรับให้โชว์ไว้สัก 25 วินาทีครับผม ส่วนถ้าเอาไปใช้กับ mootools หรือตัวอื่น ๆ ก็เปลี่ยนการ windows.onload เป็นแบบอื่น แทนการใช้ jQuery(document).ready(); ครับ

เรามาร่วมด้วยช่วยกันประกาศครับผม เอาพวกไม่ได้มาตรฐานออกไปจากสังคมสักทีนึงครับผม

4 thoughts on “ร่วมด้วยช่วยกัน Say No To IE 6! สำหรับเว็บที่ใช้ jQuery (และพวก Prototype JavaScript ตัวอื่น ๆ ด้วย)

  1. Say No To IE ไปเลยไม่ครับ
    เบื่อกับการทำ closs browser แล้วล่ะ เมื่อไหรจะเป็นมาตรฐานจริงซักที่น่ะ

  2. บน Safari 3.x jQuery หลายๆตัวก็ทำงานผิดพลาดครับ เห้อ… เหนื่อยจาย

Leave a Reply