코딩75 [웹스퀘어] 모바일 meta tag 설정하기 웹스퀘어에서 모바일 화면을 미리볼 때 설정에서 간혹 mete tag가 빠져있어서 모바일화면이 제대로 안나올 때가 있다. 일일이 페이지마다 넣지 않고 공통으로 meta tag를 넣어서 한번에 설정하는 방법. 1. 웹스퀘어 메뉴 > Window > Preference 클릭 2. 아래 화면과 같이 WebSquare > Engine Modification 선택 3. Engine Resource 에서 websquare.html 선택 후 아래 meta tag 추가 2023. 1. 25. [웹스퀘어] 새창 팝업 띄우기 스크립트 웹스퀘어에서 레이어팝업이 아니라 윈도우 새창팝업을 띄울 때 아래 스크립트를 응용하면 된다. // 인쇄버튼 scwin.trigger1_onclick = function(e) { WebSquare.uiplugin.popup.createPopup("popup1", "window", "window popup", "width:1300;height:800;", "false", "true", "/xml/sub/MGM001D00.xml", "", "", ""); }; 2022. 12. 14. [웹스퀘어] 그리드 readonly 클릭 방지 그리드를 그릴 때 textarea를 쓰는 경우가 있음. 보통은 readonly를 주면 일반 input은 클릭방지가 되어있지만 textarea는 더블클릭시 수정모드로 인풋테두리가 생김 해결방법은 readonly가있는 컬럼에 showReadOnly="false" 를 붙여주면 됨. (아직 속성에 추가가 안되므로 코드로 넣어야 함) 2022. 11. 22. ol 태그 css로 자동 넘버링 ol.dot_list{counter-reset:numbering;list-style:none;} ol.dot_list > li{position:relative;padding-left:33px;} ol.dot_list > li:before{counter-increment:numbering;content:counter(numbering);position:absolute;top:7px;left:0;width:22px;height:22px;font-size:13px;line-height:22px;font-weight:800;text-align:center;color:#fff;border-radius:100%;background:#62676e;} ol.dot_list > li > p{font-size:22px;l.. 2022. 11. 11. [페이지인식] 페이지 인식소스 업그레이드 버전 웹사이트 코딩을 할 때, 현재 페이지가 어느 위치에 속해 있는지 메뉴에 표시를 해주고 싶을 때가 있다. 예전에 블로그에 쓴 글은 각 페이지마다 jquery 스크립트를 넣어 일일이 eq값을 입력해서 on class를 붙여주는 방식이었는데.. 지금 생각해보면 매우 비효율 적인 방법.. 이번에는 자동으로 페이지 location 값을 가져와서 on class를 붙여주는 방법을 써보겠다. 물론 인클루드 상태일 때도 가능하다. 공통 스크립트 파일에 스크립트를 한번만 넣어주면 됨. html 마크업 예시 메뉴1 메뉴2 메뉴3 메뉴4 on 클래스 스타일을 만들어주고.. .sidebar-menu li {width:100px; height:30px; color:darkgray;} .sidebar-menu li.on {col.. 2022. 6. 1. css 가운데 정렬 transform CSS로 가운데 정렬을 하는 방법은 여러가지가 있음. HTML CODE 가운데 정렬 1. position absolute와 transform을 이용한 방법 코드가 간단하긴 하지만 특정 브라우저에서 컨텐츠가 흐려져 보이는 경우가 있음. .center_wrap{ position: relative; width: 100%; height: 100%; } .center{ position: absolute; top: 50%; left: 50%; transform:translate(-50%, -50%); } 2. position absolute와 margin을 이용한 방법 컨텐츠의 width, height 값이 정해져 있을때 가능한 방법. width, height 의 절반px 만큼 마이너스 값으로 줘서 맞춤. .cen.. 2021. 11. 1. [javascript] 브라우저 전체화면 스크립트 브라우저를 전체화면(풀스크린)으로 전환해주는 버튼 스크립트. 전체화면 버튼을 클릭하면 웹브라우저가 전체화면으로 변경되는 동시에, 창모드 버튼이 활성화 되고 전체화면 버튼은 비활성화 된다. 창모드를 버튼 클릭시 웹브라우저는 이전 크기로 돌아가며 전체화면 버튼이 활성화되고 창모드 버튼은 안보이게 된다. HTML 전체화면 창모드 CSS .close-fullscreen {display: none} javascript var doc = document.documentElement; // 전체화면 설정 function openFullScreenMode() { if (doc.requestFullscreen) doc.requestFullscreen(); else if (doc.webkitRequestFullscreen.. 2021. 8. 19. [jquery] 셀렉트박스 선택시 다른 셀렉트박스 설정옵션 selectbox 옵션 선택시, 2차 selectbox가 옵션에 따라 다르게 보여야 할 때 사용하는 스크립트. HTML 게임값 ▲ / ▼ 홀짝 로또 상태값 ▲ ▼ = 홀 짝 홀홀 홀짝 짝홀 짝짝 1 2 3 4 5 jQuery // search form selectbox $('select[name=search_game]').change(function(){ var $this = $(this).val(); $(this).closest('.form-row').find('select[name=' + $this +']').siblings().hide(); // 보여야 할 select박스를 제외한 select를 가림 $(this).closest('.form-row').find('select[name=' + $thi.. 2020. 9. 16. bootstrap 드롭다운 메뉴 hover시 작동하도록 부트스트랩 4.x 버전에서 hover에 대한 data 설정이 빠져버린것 같다;클릭시만 드롭다운되도록....navbar 사용시 너무 불편한것 같아서 hover시 열리도록 스크립트를 찾아봄. css .dropdown-toggle::after { transition: transform 0.15s linear;}.show.dropdown .dropdown-toggle::after {transform: translateY(3px);}.dropdown-menu {margin-top: 0;} /* hover 메뉴때문에 넣음 */ jquery var $dropdown = $(".navbar-nav .dropdown"); var $dropdownToggle = $(".dropdown-toggle"); var $dropd.. 2020. 9. 1. 이전 1 2 3 4 ··· 9 다음
