TIL

282일차(모험 191일차) - css, js 수정

haedal-uni 2022. 6. 24. 20:15
728x90

CSS

버튼 모양 없애기(전 → 후)

 

.Btn{
    width: 220px;
    height: 190px;


    border: 0;
    outline: 0;
}

출처 : css를 이용한 버튼/링크 테두리 없애기

 

 

 

 

버튼에 마우스 커서 갖다대면 모양 변경시키기

.Btn{
    cursor: pointer;
}

출처 : HTML 버튼이나 이미지 같은데 마우스 오버 되면 커서가 손모양으로 바뀌게 하기

 

 

 

 

제목 20자 이상이면 이후에 "..." 으로 출력 시키기

if(title.length >= 20) {
    title = title.substr(0,20) + "...";
}

 

 

 

 

마우스를 버튼에 갖다댔을 때 색 변경시키기

.makeListPostBtn:hover{
    background: #D5EDFFC6;
    cursor: pointer; /* 마우스 커서 모양 변경 */
}

출처 : [CSS 강좌] 마우스 오버 효과

 

 


JS

로그인에서 실패 msg가 뜨고 회원가입 창으로 다시 전환될 때 여전히 로그인 실패 msg가 띄워져있다. 이를 초기화 시켜준다.

<div id="right"  onclick="deleteMsg()">
function deleteMsg() { // 로그인 실패 msg 띄워준 후 회원가입 창으로 변경 시
    $(".Login-danger").text("") // 로그인 msg 초기화
}

 

 

 

마찬가지로 회원가입에서 실패 후 로그인 버튼을 눌렀을 때 회원가입 실패 msg를 초기화 시켜준다.

<div id="left" onclick="deleteSignUpMsg()">
function deleteSignUpMsg() {
    $(".alert-danger").text("")
}

 

front : [add] 회원가입, 로그인, registry 페이지 css 및 js 수정 [#85] #86

728x90