반응형
이번에 기록형으로 자바스크립트를 이용한 div를 랜덤으로 표현하는 방법 입니다.
<script type="text/javascript">
window.onload=function() {
var E = document.getElementsByClassName("item");
var m = E.length;
var n = parseInt(Math.random()*m);
for (var i=m-1;i>=0;i--) {
var e = E[i];
e.style.display='none';
}
E[n].style.display='';
}
</script><div class="item">1</div>
<div class="item">2</div>
<div class="item">3</div>
<div class="item">4</div>
위와 같습니다.
1~4 중 1개만 랜덤으로 나타냅니다.
다음에 언젠가 써먹을 날이 있겠죠? ㅋㅋ
Updating.....
아래 내용은 4개 업체를 섞어서 4개 모두 보여주는 소스 입니다.
<head>에 입력할 내용
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var cards = $(".photographer");
for(var i = 0; i < cards.length; i++){
var target = Math.floor(Math.random() * cards.length -1) + 1;
var target2 = Math.floor(Math.random() * cards.length -1) +1;
cards.eq(target).before(cards.eq(target2));
};
});
</script>
본문내용 div에 적용할 것
<div class='photographer'>
내용1
</div>
<div class='photographer'>
내용2
</div>
<div class='photographer'>
내용3
</div>
<div class='photographer'>
내용4
</div>반응형
'돈되는 이야기 > 수익형블로그' 카테고리의 다른 글
| 그누보드 게시판별 폰트 적용하기 (0) | 2021.07.04 |
|---|---|
| PC화면에서 모바일로 어떻게 보이는지 확인 하는 사이트 (0) | 2021.05.17 |
| 부가가치세 / 종합소득세 이해하기 - 구글 애드센스 수익 (0) | 2021.04.29 |
| 구글 애드센스 수익 5천불 이상 달성시 해외타발송금 지급증빙서류 제출 (3) | 2021.04.26 |
| TOP 버튼 만들기 (1) | 2021.03.08 |
◀ 댓글 ▶