2014-08-18 4 views
1

Я пытаюсь складывать абзацы друг на друга. И когда я наведите курсор мыши, я хочу, чтобы этот конкретный абзац появился. Но я получаю ошибки:Функция JavaScript undefined error onmouseover

Uncaught ReferenceError: Invalid left-hand side in assignment

JS:

var topLayer = "p3"; 


function moveIt(toTop) 
{ 
    var oldTop = document.getElementById(topLayer).style; 
    var newTop = document.getElementById(toTop).style; 

    oldTop.z-index = "0"; 
    newTop.z-index = "10"; 

    topLayer = document.getElementById(toTop).id; 
} 

HTML:

<html> 
<head> 
    <title>Text of Stacked Paragraph</title> 
    <link rel="stylesheet" href="stacked.css" type="text/css"> 
    <script type="text/javascript" src="stacked.js"></script> 
</head> 
<body> 
    <p id="p1" class="para1" onmouseover="moveIt('p1')"> 
     This is one of the paragraphs. 
    </p> 
    <p id="p2" class="para2" onmouseover="moveIt('p2')"> 
     Another paragraph. 
    </p> 
    <p id="p3" class="para3" onmouseover="moveIt('p3')"> 
     More paragraph. 
    </p> 
</body> 

Где я делаю неправильно?

+0

где 'moveIt' определяется? –

+1

какая линия? Вы проверили Chrome Inspector? Синтаксис «oldTop.z-index» действителен? –

+1

Из веб-мастера StackExchange: [Как открыть консоль JavaScript в разных браузерах?] (Http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers) –

ответ

3
свойство

DOM элемента z-index устанавливается через zIndex:

var topLayer = "p3"; 

function moveIt(toTop) { 
    var oldTop = document.getElementById(topLayer).style; 
    var newTop = document.getElementById(toTop).style; 

    oldTop.zIndex = "0"; 
    newTop.zIndex = "10"; 

    topLayer = document.getElementById(toTop).id; 
} 

Jsfiddle пример: http://jsfiddle.net/d4LLfs6e/1/

+0

Спасибо! Теперь работает. – Robin

+0

Нет проблем. Рад слышать это! – PaulDapolito

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