자바스크립트에서 동적으로 변수를 선언할 때.

 

간단 예제,

eval("playButton_"+i+" = document.querySelector('#toggleplay_"+i+"')");

eval("muteButton_"+i+" = document.querySelector('#togglemute_"+i+"')");

eval("playButton_"+i).addEventListener('click', onTogglePlay(i));

eval("muteButton_"+i).addEventListener('click', onToggleMute(i));

 

eval("vrView_"+i).on('ready', onVRViewReady(i));

eval("vrView_"+i).on('play', function() {});

eval("vrView_"+i).on('pause', function() {});

 

동적 변수를 선언 가능.

'javascript' 카테고리의 다른 글

스마트에디터 모바일에서 스크롤 안되는 문제  (0) 2021.04.21
(javascipt) 팝업 닫기시 유투브 영상 종료하기.  (0) 2018.02.20
parabola.js 이용한 포물선 이미지 구현하기.  (0) 2018.02.01
모바일 ios에서 iframe width:100% 안 될때.  (2) 2017.12.27
javascript 애드센스 다는 방법 - 초급  (0) 2017.08.24

안녕하세요.

 

요즘 이미지는 그냥 보여주지는 않고 이미지 오버시 확대나 이벤트를 발생시켜서 생동감있는 페이지를 연출하는데요.

제일 간단하게 이미지 마우스 오버시 확대되고 마우스가 벗어나면 다시 되돌아오는 효과를 알려드리려고 합니다.

 

일단 정말 간단합니다.

 

1. html

<html>

<body>

<h1>이미지 확대 테스트 </h1>

<img class="scale" src="이미지 경로"/>

</body>

</html>

 

2. css

.scale {
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transition: all 0.5s ease-in-out;  /* 서서히 확대 */
}
.scale:hover {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}

 

1번의 html에 이미지에 class를 추가 해주면 간단하게 서서히 확대 되었다가 축소되는 효과를 볼 수 있습니다.

 

감사합니다^^

'html' 카테고리의 다른 글

HTML 한글 깨짐 관련.  (0) 2017.07.05

안녕하세요.

 

그누보드/영카트에서 작업하시다보면 새로운 php를 만들어서 ajax로 제어 및 session을 공유가 필요한 경우가 생기는데요. 아주 쉽게 session 공유하는 방법을 알려드립니다.

 

##그누보드/영카트 웹디렉토리.

1. /웹디렉토리/test.php를 만든다.

2. php 상단에 추가

@session_save_path($_SERVER["DOCUMENT_ROOT"]."/data/session");
@session_start();

3. print_r($_SESSION); 

 

이렇게 session 을 가져와서 해당 script는 맴버 외에는 막는다던지, session id값으로 mysql query를 날리시면 됩니다.

 

감사합니다.

'php' 카테고리의 다른 글

네이버 SNS 로그인(PHP) 구현하기.  (0) 2019.12.26
카카오톡 SNS 로그인 구현하기.  (1) 2019.12.26
다중 배열에서 key로 정렬하기(php array_multisort )  (0) 2018.02.20
LDAP 클라이언트와 서버 연결 방법(1)  (0) 2018.01.05
영카트에 페이팔 연동 - 실시간 환율 적용  (5) 2017.12.20

+ Recent posts

티스토리툴바