단어에 자바 스크립트가

-3

나는 자바 스크립트에서 새로운 코드이고 나는 js를 사용하여이 예제를 어떻게 할 수 있는지 궁금하다. 자바 스크립트를 시작하기 animation words javascript 단어에 자바 스크립트가

2016-12-28 CristJian Cordero Loor

당신은 당신이 지금까지 작성한 몇 가지 코드를 공유 할 수 있습니까? –

안녕하세요, 내가 말했듯이, 나는 단지 js를 배우는 것입니다, 나는 단지 기본을 알고 있습니다. 그래서 누군가가 이걸 통해 나를 인도하는 것을 도울 수 있는지 궁금 해서요. –

캔버스를 사용하고 있습니까? 그걸 달성하기위한 많은 애니메이션 라이브러리가 있습니다. – areiilla

이렇게 많은 방법으로이 문제를 해결할 수 있습니다. 난 그냥 당신이 가장 추한 방법을 보여줍니다 이것은 setInterval 메서드와 함께 순수 자바 스크립트를 사용하고 있습니다.

var arrOfWord=["cat","dog","fun","sat","wen","ten","sun","net","hat"]; 
 
var arrOfDiv=[]; 
 
var con=document.getElementById("container"); 
 
for(var i in arrOfWord){ 
 
    con.innerHTML+="<div id='word-box'>"+arrOfWord[i]+"</str>"; 
 
} 
 
arrOfDiv=con.children; 
 
window.setInterval(
 
(function(){ 
 
    var next=0; 
 
function highlightWord(){ 
 
    
 
    if (next>arrOfDiv.length-1){ 
 
    next=0; 
 
    } 
 
    if (next==0){ 
 
    arrOfDiv[arrOfDiv.length-1].style="border: 2px solid #00000000"; 
 
    } 
 
    else arrOfDiv[next-1].style="border: 2px solid #00000000"; 
 
    arrOfDiv[next].style="border: 2px solid #ffff00"; 
 
    next+=1; 
 
} 
 
    return highlightWord; 
 
})(),500 
 
);

#word-box{ 
 
    display: inline-block; 
 
    padding:5px; 
 
    margin:2px; 
 
    border-radius:5px; 
 
    border: 2px solid #00000000; 
 
} 
 

 
#container{ 
 
    width:140px; 
 
}

<div id="container"> 
 
    
 
</div>

출처

2016-12-29 00:00:03 areiilla

그걸 만드는 데 많은 도움을 주셔서 감사합니다. 어떻게 그 일을 할 수 있는지 이해할 수 있습니다. 캔버스에서 그걸 생각하고 있었으므로 이미지와 이미지가 맞습니까? –

-1

시작 일 : 단어의 배열 및 각 단어 사이 강조

예의 속도와 선택.

나는이 같은 튜토리얼을 시작할 것 : http://www.w3schools.com/jquery/

그것은 코드와 HTML 요소를 변경하는 방법을 안내합니다.

자바 스크립트를 사용하여 CSS 속성을 편안하게 설정 한 후에는 setTimout() 또는 setInterval을 살펴보고 설정된 시간 일정의 시각적 변경 사항을 애니메이션으로 표시하고 순환 할 수 있습니다.

출처

2016-12-28 23:13:31

단어에 자바 스크립트가

답변

관련 문제