본문 바로가기

Local Oriented/HTML CSS JS

 (99)
자바스크립트 다시 공부 심도있는 개념들이 잘 설명되어 있어요, 예제와 함께..https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide You don't know 시리즈https://github.com/getify/You-Dont-Know-JS/blob/master/up%20&%20going/README.md#you-dont-know-js-up--goinghttps://github.com/getify/You-Dont-Know-JS/blob/master/scope%20&%20closures/README.md#you-dont-know-js-scope--closureshttps://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20o..
float 과 text-align 의 이상한 만남..? 아래 2개의 코드는 개념상 동일하게 렌더딩 되어야 함에도 불구하고, IE(MS 사의 인터넷 익스플로러) 몇가지 버전에서 다르게 표시가 되네요.. ㅠ.ㅜ 다른 웹브라우저들에서는 정상적으로 나오고요.. 1. ......... 2. ......... 그런데, 위의 2번으로 하면 두번째 span 태그의 내용이 다음 라인으로 밀려나는 현상이 발생하더군요. IE 모든 버전에서 그런 것이 아니고, IE7 과 IE8 의 몇몇 마이너버전(?)에서 발생했습니다. 볼수록 알 수 없는 MS 사의 개발 정책에 일단 두 손 다 들었습니다.
동영상을 object 로 기술할 경우 embed 도 같이 기술해 주세요. 가비아 동영상의 경우 4가지로 동영상을 열 수 있는데요.. 아래에 제시된 4가지가 바로 그것입니다. 그런데, object 와 embed 한 가지만을 적용하는 경우, 웹브라우저 종류에 따라 동영상이 보이지 않을 수 있습니다. object 만 사용하는 경우, MS 사의 인터넷 익스플로러에서는 정상적으로 동영상이 보이지만, 크롬에서는 보이지 않는 식이지요. 그래서 object 안에 embed 코드를 추가해 주어야 합니다. 구체적인 방법은 말미에 기술하였습니다. 1. 동영상링크주소 http://web.flv.gabia.com/flash_skin/player.swf?file_key=...&allowmaximize=YES&width=640&height=480 2. 동영상페이지주소 http://flv.gabia.co..
이미지 위에 레이어를 올렸는데, 브라우저 폭이 변할때 같이 변하지 않거나 레이아웃에 가로줄이 생길때.. o 박스 안에 이미지와 절대좌표 박스가 들어간 형태에서 호환성 보기를 하면 레이아웃에 금이 가는 현상 다른 웹브라우저나, IE 일반 모드에서는 정상인데.. 유독 IE 호환성 보기에서 레이아웃이 깨짐. ... 이때는.. img 와 absolute 인 div 사이에 공간이 없게 해야 하는군요. ... 그런데, 브라우저 폭이 변할때 absolute 로 잡은 영역이 같이 변하지 않아서 레이아웃이 깨진다면.. 아래와 같이 relative 영역에 이미지를 가져다 사용하는 것이 필요. ...
a 태그에 name 속성 사용시 주의사항 아래와 같이 XHTML 1.0 Transitional 로 정의된 HTML 에서 a 태그는, 와 같이 사용하지 않고, 와 같이 사용한다면 대략 난감합니다. ^^. 아래와 같은 코드가 있다고 생각해 봅시다. '텍스트A' 에는 밑줄이 그어집니다. 참 놀랍죠..? 텍스트A 밑줄이 그어지지 않은 정상적인 상태로 하려면.. 아래와 같이 되어야 합니다. 텍스트A .Fine.
CSS 스타일, 팝업시 배경 투명도, opacity alpha 투명도는 30% 대가 적정..? 투명하게 하려면 완전히 검은색(#000) 에서 35% 투명도가 괜찮은듯.. background:#000; opacity:.35; filter:Alpha(Opacity=35);
모바일 기기에 특화된 메타 태그 maximum-scale 을 1.0 이상으로 설정해도 user-scalable=no 이면 화면 확대/축소가 불가. 애플에서는.. user-scalable 이 no 라도,minimum-scale 을 1.0 이상으로 설정하면 initial-scale 값에 상관없이 최초 화면이 해당 크기로 확대.안드로이드에서는.. user-scalable 이 no 라면,minimum-scale 이나 initail-scale 값에 상관 없이 크기 불변.. ㅎㅎuser-scalable 이 yes 이면 사용자가 확대해 볼때 화면 사이즈가 변경.아직 통일이 안 되어 있음. 애플이나 안드로이드나 동일하게 작동하는 것은..아예 사이즈가 고정되는 것은 상기와 같고,사이즈를 일정하게 확대/축소 시키는 것은 아래와 같음.. target-de..
스핀 spin 자바스크립트 (jQuery 나 prototype 가능) 순수 자바스크립트와 jQuery, prototype 에서도 가능하고.. IE6.x 와 xFlatform 이 되는 스핀 플러그인. http://fgnass.github.com/spin.js/ 제작자는, stop() 한 다음에 다시 spin() 하면 된다 했는데.. spin(option) 으로 하지 않으면 기본 옵션이 적용되므로 유의. 순수 자바스크립트에서는 아래와 같이 사용. 스핀 생성시에 자바스크립트 전역 변수에 담아 두었다가 정지시키는 방식. Hi, there1!! Hi, there2!! Hi, there3!! 그러면, jQuery 에서는..? jQuery 의 data() 를 사용하네요. Hi, there1!! Hi, there2!! Hi, there3!!

티스토리툴바