'Tip'에 해당되는 글 1건

  1. 2004.10.02 포스팅 시에 사용할만한 DHTML과 CSS들... 3
2004-10-02 오후 7:09:23

<a href="#none" onclick="this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';" onfocus="this.blur(0);">blabla...</a><divstyle="display:none">어쩌고저쩌고</div>

[ 시험삼아 테스트 ]

뭘 이런걸 다...
아, 이글로스의 특성 상 CrLf가 들어가는 자리에 자동으로
이 들어가니.. nextSibling 객체가 br 이 된다.
그러므로 하드리턴 없이 바로 앵커태그 뒤에 dif를 붙여야 한다. 주의!


source by 한님Notice


2004-10-03 오전 3:25:42

DIV 요소의 boxgray라는 class를 CSS에 추가.
인용 글 등에 사용해 보자 q *' ㅡ '乃

<div class="boxgray">blabla..</div>

div.boxgray {
BACKGROUND-COLOR: #EEEEEE;
BORDER-TOP: 1px solid #DDDDDD;
BORDER-LEFT: 6px solid #FFFFFF;
BORDER-RIGHT: 1px solid #DDDDDD;
BORDER-BOTTOM: 1px solid #DDDDDD;
WIDTH: 100%;
PADDING: 9PX;
MARGIN-TOP: 16px;
font-size: 8pt;
color: #555555;
font-family: Tahoma, 돋움;
}

source by 중년탐정 제닉스님의 오. 이글루스 OPML Export 지원 !!

위의 More/Less기능과 합치면;
<a href=#none onclick="this.nextSibling.style.display=(this.nextSibling.style.display=='none')?'block':'none';" onfocus="this.blur(0);">blabla...</a>><div class="boxgray" style="display:none">어쩌고저쩌고</div>



2004-10-03 오전 3:25:42

덤으로 HR요소도 CSS에 추가~
위에 보이는대로...
HR {
MARGIN-TOP: 16px;
BORDER : 2PX dotted #D0D0CC;
}



2004-10-03 오후 1:40:43

SPAN요소에 tooltip 클래스를 추가.
<spanclass="tooltip" title="예제같은게 필요하려나...">블라블라블라블라</span>

SPAN.tooltip {
BORDER-BOTTOM: 1PX DOTTED #296FAB;
cursor: help;
}



안보이는 글을 드래그하면 보여지는 그런 류의 CSS도 표현해보고 싶었다.(물론 다르게)
<span class="hidden" onmouseover="this.style.borderBottom='';this.style.color='black';" onmouseout="this.style.borderBottom='1px dotted black';this.style.color='#F6F6F6';">onmouseover를 써서 좀 지저분해 보이긴 하지만..</span>
,