/ / Zmena farby id [zatvorené] - javascript, jQuery

Zmena farby id [zatvorené] - javascript, jquery

Som v tomto nový. Chcel by som vedieť, či mi môžeš pomôcť. Rád by som si náhodou všimol farbu id (obdĺžnik). Chcem, aby sa farba každých 5 sekúnd zmenila na niektoré farby, ktoré som už vybral, a keď kliknete na obdĺžnik, prevezme farbu v tom čase. Ďakujem.

odpovede:

0 pre odpoveď č. 1

Najprv by ste mali vybrať svoj prvok pomocou selektora jQuery id selector (http://api.jquery.com/id-selector/). Napríklad, ak ste prvok nazvaný „MyElement“, mali by ste napísať $ („# MyElement“)

Po výbere prvku môžete niektoré zavolaťjQuery funkcie. Vo vašom prípade môžete volať funkciu .css () a zmeniť farbu pozadia vášho obdĺžnika (môže to byť prvok div?). Takže kód bude ako $ ("# MyElement"). Css ("farba pozadia", "červená");

V poli JavaScript môžete preddefinovať farby: var colours = ["red", "green", "blue"]; a potom vytvorte metódu, ktorá sa bude volať každých 5 sekúnd (pomocou metódy JavaScript setInterval) a zmení farbu.

Napísal som vám celý kód: http://jsfiddle.net/Ww74t/

HTML:

<div id="MyElement"></div>

CSS:

#MyElement {
width: 500px;
height: 500px;
}

JavaScript:

var colors = ["red", "green", "blue"];
var currentColorIndex = 0;
$("#MyElement").css("background-color", colors[currentColorIndex % colors.length]);
setInterval(function(){
currentColorIndex++;
$("#MyElement").css("background-color", colors[currentColorIndex % colors.length]);
},5000);

1 pre odpoveď č. 2

Skúste to:

HTML:

<div id="rectangleId">Test</div>

scenár:

$(function(){
var myArray=["red","yellow","blue"];
$("#rectangleId").on("click",function(){
var rand = myArray[Math.floor(Math.random() * myArray.length)];
$(this).css("color", rand);
});
});

Fiddle: http://jsfiddle.net/3QMuT/

pre Automatická zmena každých 5 sekúnd použite vyššie uvedený kód, napríklad:

scenár:

$(function(){
var myArray=["red","yellow","blue"];
setInterval(function(){
var rand = myArray[Math.floor(Math.random() * myArray.length)];
$("#rectangleId").css("color", rand);
},5000);
});

Fiddle: http://jsfiddle.net/3QMuT/1/

Poznámka: Musíte pridať akékoľvek jQuery version pred použitím.