자바스크립트 질문 드려요
본문
$(document).ready(function(){
var window_h = $(window).height();
var window_w = $(window).width();
var header_h = $(".header").height();
my_work_set();
$(window).load(function(){
window_h = $(window).height();
window_w = $(window).width();
header_h = $(".header").height();
my_work_set();
});
$(window).resize(function(){
window_h = $(window).height();
window_w = $(window).width();
header_h = $(".header").height();
my_work_set();
});
function my_work_set(){
$(".my_work .container").height(window_h-header_h);
}
var work_status;
$(".my_work .container .work_list>ul>li .more").on("click", function(){
work_status = $(this).parent().hasClass("open");
if(work_status == true){
$(this).parent().removeClass("open");
}else{
$(this).parent().addClass("open");
}
});
$(".layer_pop .btn_close, .layer_pop_frame .btn_close, .layer_pop_bg").on("click", function(){
$(".layer_pop").hide();
$(".layer_pop_frame").hide();
$(".layer_pop_bg").fadeOut(300);
$("html, body").css({overflow : "visible", height : "auto"}).unbind('scroll touchmove mousewheel');
});
//검사실시에 탭 열고 닫기
var cnt_status;
$(".cnt_group .cnt_tit").on("click", function(){
cnt_status = $(this).parent().hasClass("close");
if(cnt_status == false){
$(this).next().slideUp();
$(this).parent().addClass("close");
}else{
$(this).next().slideDown();
$(this).parent().removeClass("close");
}
});
$(".chk_ready .cnt_tit, .chk_complete .cnt_tit").on("click", function(){
cnt_status = $(this).hasClass("close");
if(cnt_status == false){
$(this).next().slideUp();
$(this).addClass("close");
}else{
$(this).next().slideDown();
$(this).removeClass("close");
}
});
//애플버튼 체크하기
var apple_status;
$(".btn_apple button").on("click", function(){
apple_status = $(this).hasClass("yes");
if(apple_status){
$(this).removeClass();
$(this).addClass("no");
$(this).next().find("input.yes").attr("checked", false);
$(this).next().find("input.no").attr("checked", true);
$(this).text($(this).next().find("input.no").parent().text());
}else{
$(this).removeClass();
$(this).addClass("yes");
$(this).next().find("input.no").attr("checked", false);
$(this).next().find("input.yes").attr("checked", true);
$(this).text($(this).next().find("input.yes").parent().text());
}
});
//검사결과에 사진을 클릭하면
$(".thumb_pic button").on("click", function(){
$(".layer_pop_bg").fadeIn(300);
$(".layer_pop .pic_area").empty();
$(this).next().clone().appendTo($(".layer_pop .pic_area"));
$(".layer_pop .tit").text($(this).parent().prev().text());
$(".layer_pop").show();
//$("html, body").css({overflow : "hidden", height : $(window).height()}).bind("scroll touchmove mousewheel", function(e){e.preventDefault();e.stopPropagation();return false;},function(){passive:false});
});
//체크박스를 이미지로 교체
$(".checkbox_img").on("click", function(){
var chk_status = $(this).hasClass("on");
//console.log(chk_status);
if(chk_status == true){
$(this).removeClass("on");
$(this).find("input[type='checkbox']").attr("checked", false);
}else{
$(this).addClass("on");
$(this).find("input[type='checkbox']").attr("checked", true);
}
});
//검사판정 결과 체크 -- 체크박스를 이미지로 교체
$(".opinion .radio_img").on("click", function(){
$(".opinion .radio_img").removeClass("on");
$(this).addClass("on");
$(this).find("input[type='radio']").attr("checked", true);
$(".complete_result").hide();
$(".complete_result.result_"+$(this).find("input[type='radio']").val()).show();
if($(this).find("input[type='radio']").val() == "fail"){
$(".complete_result.result_fail .result_cnt .result_comment").remove();
$(".chk_complete .result_list>li .tit").filter(":contains('부적합')").next().clone().appendTo($(".complete_result.result_fail .result_cnt"));
$(".complete_result.result_fail .result_cnt .result_comment .thumb_pic").remove();
$(".complete_result.result_fail .result_cnt .result_comment ul li").append("<textarea class='input w_100per h_50px'></textarea>");
}
});
//탭메뉴
$(".tab_cnt ul li button").on("click", function(){
$(".tab_cnt ul li").removeClass("on");
$(this).parent().addClass("on");
$(this).next().show();
$(".tab_cnt").height($(this).next().height() + 55);
});
//표준복장 체크
$(".cloth_standard ul li button").on("click", function(){
$(".cloth_standard ul li").removeClass("on");
$(this).parent().addClass("on");
});
$(".cloth_chk .cloth_sign .sign").on("click", function(){
$(this).addClass("pop");
$(".layer_pop_bg").fadeIn(300);
$(".sign_pop").show();
//$(".layer_pop .pic_area").empty();
//$(".sigPad").appendTo($(".layer_pop .pic_area"));
//$(".layer_pop .tit").text("서명하기");
//$(".layer_pop").show();
//$("html, body").css({overflow : "hidden", height : $(window).height()}).bind("scroll touchmove mousewheel", function(e){e.preventDefault();e.stopPropagation();return false;},function(){passive:false});
});
$(".sign_pop .btn_close, .layer_pop_bg").on("click", function(){
var sign_w = $(".cloth_chk .cloth_sign .sign").width();
var sign_h = $(".cloth_chk .cloth_sign .sign").height();
$(".sign_pop").hide();
$(".layer_pop_bg").fadeOut(300);
$("html, body").css({overflow : "visible", height : "auto"}).unbind('scroll touchmove mousewheel');
//$(".sign_pop .pad").clone().appendTo($(".cloth_chk .cloth_sign .sign"));
//$(".cloth_chk .cloth_sign .sign .pad").css("transform", "scale(0.2)")
});
$(".drawing_pop .btn_close, .drawing_pop .drawing_map map area, .drawing_pop .drawing_list ul li").on("click", function(){
$(".drawing_pop").hide();
$(".drawing_pop_bg").fadeOut(300);
});
$(".drawing_view").on("click", function(){
$(".drawing_pop").show();
$(".drawing_pop_bg").fadeIn(300);
});
$(".header .header_sub .device .car").on("click", function(){
pop_iframe_open("car", "운행차량 설정");
});
$(".header .header_sub .device .machine, .ready_machine").on("click", function(){
pop_iframe_open("machine", "계측기 설정");
});
$(".header .header_sub .person ul").on("click", function(){
pop_iframe_open("person", "동행자 설정");
});
$(".my_work .container .work_list .work_add button").on("click", function(){
pop_iframe_open("work", "업무추가");
});
$(".my_work .container .work_list>ul>li.open .info button").on("click", function(){
pop_iframe_open("info", "고객정보");
});
function pop_iframe_open(pop_name, title){
$(".layer_pop_frame").removeClass("car");
$(".layer_pop_frame").removeClass("machine");
$(".layer_pop_frame").removeClass("person");
$(".layer_pop_frame").removeClass("work");
$(".layer_pop_frame").removeClass("info");
$(".layer_pop_frame").addClass(pop_name);
$(".layer_pop_frame .tit").text(title);
$(".layer_pop_frame iframe").attr("src", "popup/"+pop_name+".html");
//var the_height=document.getElementById('layer_pop_frame').contentWindow.document.body.scrollHeight;
$(".layer_pop_frame .pop_cnt").height(window_h-150);
$(".layer_pop_frame").show();
$(".layer_pop_bg").fadeIn(300);
}
});
function pop_open(pop_name){
pop_name = $("."+pop_name);
pop_name.show();
$(".layer_pop_bg").fadeIn(300);
}
//오늘 계산
function getToday(){
var now = new Date();
var year = now.getFullYear();
var month = now.getMonth() + 1;
var date = now.getDate();
if((month + "").length < 2){
month = "0" + month;
}else{
month = "" + month;
}
return today = year+"."+month+"."+date;
}
function getAfterDay(type, after){
var date = new Date();
var year;
var month;
var date;
if(type == "month"){
date.setMonth(date.getMonth() + after);
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
document.write(year+"."+month+"."+day);
}
if(type == "year"){
date.setFullYear(date.getFullYear() + after);
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
document.write(year+"."+month+"."+day);
}
}
이부분에서 버튼을 누르면 슬라이드 버튼이 닫히고 열리고 하는데 로드 되었을때 열려있습니다.. 처음에 닫힌 상태로 로드되게 하려면 어떻게 해야할까요?
스트립트를 아예 몰라서.ㅠ.ㅠ
부탁드릴게요.ㅠ.ㅠ
답변 1
.cnt_group 클래스를 가진 html 요소에 close 클래스를 추가하세요
// 예시
<div class="cnt_group"> ~~~ </div>
==>
<div class="cnt_group close"> ~~~ </div>