Исключительное текстовое упражнение (jquery/Javascript)

Я изучаю jquery/javascript, и я сделал упражнение точно так, как говорила книга. Тем не менее, поле диапазона не движется с зависанием, как предполагается.Исключительное текстовое упражнение (jquery/Javascript)

Если кто-то может помочь мне узнать, что я сделал неправильно, я бы очень признателен! Большое спасибо

JSFiddle Ссылка: http://jsfiddle.net/036bz98a/

Вот это HTML:

<body> 
    <span id="elusiveText" onmouseover="moveIt()">Click Me</span> 
</body>

CSS:

span { 
position: absolute; 
top: 150px; 
left: 100px; 
background-color: #0066AA; 
color: #FFFFFF; 
font-weight: bold; 
border: 2px solid #C0C0C0; 
padding: 3px; 
border-radius: 5px; 
-webkit-border-radius: 5px; 
-moz-border-radius: 5px; 
}

Javascript:

function moveIt(){ 
var coords = new Array(10,50,100,130,175,225,260,300,320,350); 
var x = coords[Math.floor((Math.random()*10))]; 
var y = coords[Math.floor((Math.random()*10))]; 
$("elusiveText").css({"top": y + "px", "left": x + "px"}); 
}

И затем я связался с последней библиотекой jQuery

Еще раз спасибо!

источник

2015-05-30 Douglas_Symb

две проблемы:

Код jQuery, который вы используете для поиска и обновления текстового элемента, имеет неправильный селектор. Линия должна выглядеть следующим образом:
```
$("#elusiveText").css({"top": y + "px", "left": x + "px"}); 
```
В jsfiddle, вам необходимо установить режим обертки JavaScript, чтобы «Нет обруч (в теле)».

источник

2015-05-30 13:39:15 Pointy

Большое спасибо за ваш ответ и подсказку jsfiddle. –

Вы используете неправильный селектор и не должны обернуть метод в onload функции (функция на jsFiddle):

function moveIt() { 
    var coords = new Array(10, 50, 100, 130, 175, 225, 260, 300, 320, 350); 
    var x = coords[Math.floor((Math.random() * 10))]; 
    var y = coords[Math.floor((Math.random() * 10))]; 
    $("#elusiveText").css({ 
     "top": y + "px", 
     "left": x + "px" 
    }) 
}

Здесь -jsFiddle- используя animate() метод вместо этого, если это дело ...

источник

2015-05-30 13:38:33

Интересно, мне нравится 'одушевленные()' альтернативный. Спасибо! –

Ваш селектор является неправильным,

Используйте # для выбора элемента по идентификатору, как это:

$("#elusiveText").css({"top": y + "px", "left": x + "px"});

источник

2015-05-30 13:39:32 iouhammi

Исключительное текстовое упражнение (jquery/Javascript)

ответ

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