Tiny Bunny
본문 바로가기
프로젝트/Team

IMMusic Project(5) - 레이아웃 1차

by 내이름효주 2024. 4. 22.
  • contactUs 레이아웃 1차 구현

🚩이미지가 있으면 좋을거같음 

  • 달력 ui 수정
    • datepicker
<script>
	$(function() {
		$("#datepicker")
            .datepicker(
                    {
                        dateFormat : 'yy-mm-dd', //Input Display Format 변경
                        showOtherMonths : true, //빈 공간에 현재월의 앞뒤월의 날짜를 표시
                        showMonthAfterYear : true, //년도 먼저 나오고, 뒤에 월 표시
                        changeYear : true, //콤보박스에서 년 선택 가능
                        changeMonth : true, //콤보박스에서 월 선택 가능                
                        buttonImageOnly : true, //기본 버튼의 회색 부분을 없애고, 이미지만 보이게 함
                        buttonText : "선택", //버튼에 마우스 갖다 댔을 때 표시되는 텍스트                
                        yearSuffix : "년", //달력의 년도 부분 뒤에 붙는 텍스트
                        monthNamesShort : [ '1', '2', '3', '4', '5', '6',
                                '7', '8', '9', '10', '11', '12' ], //달력의 월 부분 텍스트
                        monthNames : [ '1월', '2월', '3월', '4월', '5월', '6월',
                                '7월', '8월', '9월', '10월', '11월', '12월' ], //달력의 월 부분 Tooltip 텍스트
                        dayNamesMin : [ '일', '월', '화', '수', '목', '금', '토' ], //달력의 요일 부분 텍스트
                        dayNames : [ '일요일', '월요일', '화요일', '수요일', '목요일',
                                '금요일', '토요일' ], //달력의 요일 부분 Tooltip 텍스트
                        yearRange : 'c-30:c+0'
                    });
	});
	
</script>
  • 주소찾기 api 적용
    • Daum 주소찾기 api 적용
      <script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
  • 파일 업로드 및 CSS 수정
    • 연주자 가입신청 ➡️ 프로필 사진 파일 업로드, 연주이력 파일 업로드
$("#file").on('change',function(){
	  var fileName = $("#file").val();
	  $(".upload-name").val(fileName);
	});
    
    
<div>
    <label for="email">사진등록</label> <input id="fileInput" class ="file111" placeholder="이미지를 선택해주세요" type="file" />
</div>
<div>
    <label for="email">연주이력</label> 
        <div class="file111 filebox">
            <input class="upload-name" value="첨부파일" placeholder="첨부파일">
            <label for="file" class="mb-2.5">파일찾기</label> 
            <input type="file" id="file">
        </div>
</div>

 

📝 5일차 회의록

https://docs.google.com/document/d/11_1BROrX2pIeKQm2MtTwoWzIaKd8xkZJFQ2pLPTthYk/edit