難以捉摸的文字練習（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

有趣，我喜歡的動畫'（）'替代。謝謝！ –

你的選擇是錯誤的，

使用＃由ID這樣的選擇元素：

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

來源

2015-05-30 13:39:32 iouhammi

難以捉摸的文字練習（jquery/Javascript）

回答

相關問題