반응형

전체 글 78

웹 접근성 키보드 포커스 처리

디자이너분의 요청으로 포커스 라인을 제거를 하는 경우가 있습니다. 이렇게 a, input, button { outline: 0; } :focus { outline: none; } 이런 경우 브라우저 상에는 라인이 노출 되지 않게 됩니다. 시각장애인 등 키보드만 이용해 웹사이트를 이용 할 경우 키보드 요소를 노출 시켜 주어야 합니다. 크롬에 추가된 :focuis-visible이란 가상 클래스(pseudo class)를 통해 이를 디자인을 해치지 않고 구현할 수 있습니다. /* 키보드로 버튼에 포커스 시 */ button:focus-visible { outline: 3px solid #000; } /* 마우스, 터치로 버튼에 포커스 시 */ button:focus:not(:focus-visible) { ou..

포토샵 작업 셋팅 / 최적화

요금은 포토샵 보다는 zeplin, figma 등을 이용해서 필요없을지 모르지만. 아직은 포토샵 사용자가 많기 때문에 제가 참고해서 많이 사용하는 초기 셋팅을 기록해 놓겠습니다. 포토샵 가이드&그리드 셋팅 https://lifenourish.tistory.com/92 포토샵이 느릴 때 최적화 방법(성능올리기) 포토샵을 사용하다보면 사진하나 여는 데도 하루종일 걸리는 경우가 있습니다. 나중에는 버벅대는 것도 모자라 메모리가 부족하다며 프로그램이 꺼지기까지 합니다. 작업물을 저장 안 해놨다 lifenourish.tistory.com * 스프라이트 이미지 정리

error - ClassNotFoundException: org.springframework.web.servlet.DispatcherServlet

정보: Marking servlet spring as unavailable 7월 03, 2012 5:22:44 오후 org.apache.catalina.core.StandardContext loadOnStartup 심각: Servlet /Spring3MVC threw load() exception java.lang.ClassNotFoundException: org.springframework.web.servlet.DispatcherServlet at org.apache.catalina.loader.WebappClassLoader.loadClass(WebappClassLoader.java:1711) at org.apache.catalina.loader.WebappClassLoader.loadClass(We..

error - Eclipse : 'Failed to create the Java Virtual Machine'

eclipse에서 실행 했을경우 Failed to create the Java Virtual Machine 이란 에러가 나타난다면 아래처럼 해보세요. eclipse.ini 에서 -- 추가 -- -vm C:\Program Files\Java\jdk1.5\bin\javaw.exe -- 추가 -- -startup plugins/org.eclipse.equinox.launcher_1.1.0.v20100507.jar --launcher.library plugins/org.eclipse.equinox.launcher.win32.win32.x86_1.1.0.v20100503 -product org.eclipse.epp.package.jee.product --launcher.defaultAction openFile -..

fade 효과 - setInterval( ) - 2가지 이미지 깜빡이며 보이기

서로다른 이미지 깜박이며 노출 HTML CSS body { background-color:#111; } #wrap{ margin:30px auto; width:600px; } .fade_container { position:relative; width:600px; height:350px; border:2px solid gold; } .fade_container img{ position:absolute; width:100%; height:100%; } .fade_container img:nth-child(1){ background-color:#fff; } .fade_container img:nth-child(2){ background-color:red; } .fade_container img:nth-chi..

이미지 사이즈에 맞게 팝업 띄우기

갤러리 작업할때 이미지를 새창으로 띄우는 경우가 있는데 이런 경우 사이즈가 다 달라서 애먹을 적이 있었습니다. 검색해보니 이렇게 사용하는 경우도 있어서 저도 사용 후 기록합니다. HTML 팝업 확인 > JS function fn_control(img){ foto1= new Image(); foto1.src=(img); Controlla(img); } function Controlla(img){ if((foto1.width!=0)&&(foto1.height!=0)){ viewFoto(img); }else{ funzione="Controlla('"+img+"')"; intervallo=setTimeout(funzione,20); } } function viewFoto(img){ largh=foto1.widt..

반응형