블로그 스킨을 변경하면서 검색창을 애플 스타일로 변경했다.
마우스 포인터를 검색창 위에 올려 놓으면(mouse hover) 아래와 같이 검색창의 배경화면과 크기가 바뀐다.
게다가 검색어를 입력하면 지우기(x) 모양도 생긴다.
검색창 관련 다른 글 :
01 [IT/블로그 관련] - 블로그 검색창(search box) 다운로드 및 튜토리얼
02 [IT/블로그 관련] - 티스토리 블로그의 검색창을 변경하는 방법
변경할 때 치환자 규칙은 "티스토리 치환자" 를 따라 했다.
- 티스토리 검색 치환자 발췌 -
사용 치환자
<s_search>, </s_search> : 검색 입력폼을 출력할 영역입니다
[ ##_search_name_##] : 검색어 입력 박스 이름
[ ##_search_text_##] : 검색어
[ ##_search_onclick_submit_##] : 검색 온클릭 이벤트
사용 예시
<s_sidebar_element>
<!-- 검색 -->
<div class="search">
<s_search>
<input type="text" name="[ ##_search_name_##]" value="[ ##_search_text_##]" onkeypress="if (event.keyCode == 13) {
[ ##_search_onclick_submit_##] }"/>
<input value="검색" type="button" onclick="[ ##_search_onclick_submit_##]" class="submit"/>
</s_search>
</div>
</s_sidebar_element>
인터넷 익스플로러 7, 8, 9 버전에서 엔터키로 검색이 안된다. 원인은?
되던 것이 안된다. 원인은 수정한 곳에서 문제가 있기 때문이라 했겠다.
비교, 비교, 비교해 보니 원인은 id와 class의 이름이 "search"로 동일하였기 때문이었다.
id명을 다른 이름으로 변경하니 인터넷 익스플로러 7, 8, 9버전에서 엔터키(event.kycode == 13)로 검색이 되었다.
