1.팝업 창 배치값 설정 & function(getPopOption) 생성
getPopOption function에 내가 넣고자하는 초기값(생성할 팝업창의 폭과 높이)을 넣어준다.(시점중요!!!!)
getPopOption(150,100,rsData.room_no)
2. 파라미터로 값을 가져온다.
getPopOption = function(newTop, newLeft, num){
으로 값을 가져온 것을 확인 후
3. 계단식 배치
1) 해당하는 div class 의 length 가 1 이상일 경우
if($('.messengerChat').length > 1){
2). body에서 해당 div class을 찾고 그 안에 css 설정값을 변경해준다.
$('body').find('.messengerChat_'+num).css(
3). 초기값(초기 css 위치 값)+ 50+ 길이값 + 'px' 을 해주면 해당 div class 값이 변하게 된다.
'top': m$.standardPosition.top + 50 * ($('.messengerChat').length - 1) + "px",
->m$.standardPosition
값(초기 css 설정 값)을 전역변수에 넣어준다.
4). 처음 위치값 전역변수에 넣어주기
m$.standardPosition
값 설정 -> 처음 배열의 위치값(offset())
left : $(".messengerChat").first().offset().left
top: $(".messengerChat").first().offset().top
💬 전체 소스 ( getPopOption())
getPopOption = function(newTop, newLeft, num){ //console.log("newTop, newLeft, num",newTop, newLeft, num) //console.log($('.messengerChat').length) //채팅방이 1개 이상일때 if($('.messengerChat').length > 1){ //console.log("$('body').find('.messemgerChat_'+num)",$('body').find('.messengerChat_'+num)) $('body').find('.messengerChat_'+num).css( { // length 값이 1이상인 것에서 length 만큼 값을 곱해줌 'top': m$.standardPosition.top + 50 * ($('.messengerChat').length - 1) + "px", 'left': m$.standardPosition.left + 50 * ($('.messengerChat').length - 1) + "px" } ) } else { m$.standardPosition = { // first()첫번째 , offset() 위치 left : $(".messengerChat").first().offset().left, top : $(".messengerChat").first().offset().top } } // $('body').find('.messemgerChat_'+num).css({'top': newTop+50+'px', 'Left': newLeft+50+'px'}) // console.log("getPopOption 들어옴 ")
참고) https://chocotaste.tistory.com/129
대단쓰 점차 진짜진짜진짜진짜 지니어스가 되어가고 있어