Javascript работает только в IE Quirks, 7 и Chrome и Firefox. Не работает в IE 8 или 9 стандартов - PullRequest
Новая
       36

Javascript работает только в IE Quirks, 7 и Chrome и Firefox. Не работает в IE 8 или 9 стандартов

0 голосов
/ 01 сентября 2011

Мой код заставляет несколько делений вращаться вокруг невидимой горизонтальной оси на плоскости. Как это работает: он запускает слушатель mouseevent onMouseDown и захватывает X курсора пользователя относительно окна. onMouseUp моделируется функцией setTimeout, которая вызывается через 90 миллисекунд, она делает то же самое и затем вычитает два значения, чтобы определить расстояние и направление вращения.

У меня вопрос: почему он работает правильно в FF, Chrome, IE Quirks и IE 7, но не в IE 8 или IE 9?

IE8: модель ломается, и деления уплывают за пределы границы раздела. IE9: Нет ответа от JS вообще.

Следующее содержит весь javascript на странице, который можно найти @ http://electrifiedpulse.com/360.html: 

<script type=text/javascript>
var objectCount = 8; var pixel = new Array(); var size = new Array();
var command = "Stop"; var panel = new Array('0','Back','Front','Front','Back','Front','Back','Front','Back'); 
var quadrant = new Array(); var originalSize = 50;
var WindowWidth = 360; var WindowWidthHalf = WindowWidth/2; var sTime=0; var s1=0; var scrollSpeed;

var myX, myY;
function myMove(evt) {
  if (window.event){myX = event.clientX;myY = event.clientY;}
  else{myX = evt.clientX;myY = evt.clientY;}
}

document.onmousemove = myMove;
if (!window.event) {document.captureEvents(Event.MOUSEMOVE);}

function iScrollStop(){
sTime = sTime - 10; 
document.getElementById('I_CONTROLS').innerHTML = sTime + ", " + scrollSpeed;
if(sTime<=0) command = "Stop";
else setTimeout(function(){iScrollStop()},10);
}

function iScrollPause(){
setTimeout(function(){this.checkPause()},100);
this.checkPause = function(){if(s1>sTime){command="Stop"; sTime=0; s1=0;}}
}

var iInitialX; //var d='Up';
function iScrollListen(d){

if(d=='Down'){ iInitialX = myX; setTimeout(function(){iScrollListen('Up')},90); iScrollPause(); 
}else if(d=='Up'){
var spinDirection = 'Right';
var iDifference = myX - iInitialX; if(iDifference < 0){ spinDirection = 'Left'; iDifference = Math.abs(iDifference);}
if (command!=spinDirection){sTime=0;s1=0;} var doScroll=0; if(command=='Stop') doScroll=1;
command = spinDirection; s1=sTime; sTime+=(iDifference*15); if(s1<=0)iScrollStop(); 
if(doScroll==1) iScroll(); 

}
}

function iScrollControl(c){command = c; if((c=='Left')||(c=='Right')) iScroll();}

function iScroll(){
scrollSpeed=(sTime<=1)? 1 : Math.ceil(sTime/1000);
if(scrollSpeed>=10)scrollSpeed=10;
scrollSpeed = 15 - scrollSpeed;

if(command=='Left') pixelDirection=2;
else if(command=='Right') pixelDirection=(0-2);
pixelDirectionNeg = (0-pixelDirection);

for(i=1;i<=objectCount;i++){
iObj = document.getElementById("iObject" + i);
pixel[i] = iObj.offsetLeft;

if((pixel[i]>=WindowWidthHalf)&&(pixel[i]<=WindowWidth)){
if(panel[i]=="Front") quadrant[i] = 4;
else quadrant[i] = 3;
}
if((pixel[i]>=0)&&(pixel[i]<=WindowWidthHalf)){
if(panel[i]=="Front") quadrant[i] = 1;
else quadrant[i] = 2;
}




if(quadrant[i]==1){
iObj.style.left = pixel[i]-pixelDirection;
size[i] = (pixel[i]-pixelDirection)*(1/(WindowWidthHalf/(originalSize/2))) + (originalSize/2);
Attribute(iObj,size[i]);
if(pixel[i]-pixelDirection<=0){quadrant[i]=2; panel[i]='Back';}
if(pixel[i]-pixelDirection>=WindowWidthHalf){quadrant[i]=4; panel[i]='Front';}
}

if(quadrant[i]==2){
iObj.style.left = pixel[i]-pixelDirectionNeg;
size[i] = (pixel[i]-pixelDirectionNeg)*(-1/(WindowWidthHalf/(originalSize/2))) + (originalSize/2);
Attribute(iObj,size[i]);
if(pixel[i]-pixelDirectionNeg<=0){quadrant[i]=1; panel[i]='Front';}
if(pixel[i]-pixelDirectionNeg>=WindowWidthHalf){quadrant[i]=3; panel[i]='Back';}
}

if(quadrant[i]==3){
iObj.style.left = pixel[i]-pixelDirectionNeg;
size[i] = (WindowWidth-(pixel[i]-pixelDirectionNeg))*(-1/(WindowWidthHalf/(originalSize/2))) + (originalSize/2);
Attribute(iObj,size[i]);
if(pixel[i]-pixelDirectionNeg<=WindowWidthHalf){quadrant[i]=2; panel[i]='Back';}
if(pixel[i]-pixelDirectionNeg>=WindowWidth){quadrant[i]=4; panel[i]='Front';}
}

if(quadrant[i]==4){
iObj.style.left = pixel[i]-pixelDirection;
size[i] = (WindowWidth-(pixel[i]-pixelDirection))*(1/(WindowWidthHalf/(originalSize/2))) + (originalSize/2);
Attribute(iObj,size[i]);
if(pixel[i]-pixelDirection<=WindowWidthHalf){quadrant[i]=1; panel[i]='Front';}
if(pixel[i]-pixelDirection>=WindowWidth){quadrant[i]=3; panel[i]='Back';}
}

}


if((command=='Left')||(command=='Right')) setTimeout(function(){iScroll()},scrollSpeed);

}

function Attribute(iObj,s){
iObj.style.width = s; iObj.style.height = s; iObj.style.top='50%'; iObj.style.marginTop = (0-(s/2))+"px"; iObj.style.zIndex = s;
}

</script>

Я не знаю, что может или не может иметь отношение к вам, поэтому я включил весь сценарий. Если вы хотите, вы можете игнорировать самую длинную функцию, 

iScroll()

1 Ответ

0 голосов
/ 01 сентября 2011

@ RyanStortz. Попробуйте зарегистрировать события следующим образом: 

var isMouseCaptured=false;
function i_boundary_mousedown(ev) {
    isMouseCaptured=true;
    iScrollListen("Down");
}
function doc_mousemove(ev) {
    if(isMouseCaptured) {
        ev=ev||event;
        myX=ev.clientX;
        myY=ev.clientY;
    }
}
function doc_mouseup(ev) {
    if(isMouseCaptured) {
        isMouseCaptured=false;
        ev=ev||event;
        myX=ev.clientX;
        myY=ev.clientY;
    }
}

var i_boundaryObj=document.getElementById('I_BOUNDARY');
if(window.addEventListener) {
    i_boundaryObj.addEventListener('mousedown',i_boundary_mousedown,false);
    document.addEventListener('mousemove',doc_mousemove,false);
    document.addEventListener('mouseup',doc_mouseup,false)
}
else if(window.attachEvent) {
    i_boundaryObj.attachEvent('onmousedown',i_boundary_mousedown)
    document.attachEvent('onmousemove',doc_mousemove);
    document.attachEvent('onmouseup',doc_mouseup)
}
else ;//

Добавить для DIV с классом "I_BOUNDARY" id атрибут "I_BOUNDARY" и удалить атрибут onmousedown .

...