728x90
반응형

css-transitions 3

CSS를 사용하여 페이지 로드시 페이드 인 효과 내기

질문 : 페이지로드시 페이드 인 효과를 위해 CSS 사용 페이지로드시 텍스트 단락이 페이드 인되도록 CSS 전환을 사용할 수 있습니까? 나는 그것이 http://dotmailapp.com/ 에서 어떻게 보 였는지 정말 좋아하고 CSS를 사용하여 비슷한 효과를 사용하고 싶습니다. 이후 도메인을 구매했으며 더 이상 언급 된 효과가 없습니다. 보관 된 사본은 Wayback Machine에서 볼 수 있습니다. 일러스트레이션 이 마크 업 : ​This is a test 다음 CSS 규칙을 사용합니다. #test p { opacity: 0; margin-top: 25px; font-size: 21px; text-align: center; -webkit-transition: opacity 2s ease-in; -mo..

CSS를 사용하여 height: 0 를 height: auto 로 전환하는 방법

질문 : 높이 전환 방법 : 0; 높이 : 자동; CSS를 사용하십니까? CSS 전환을 사용하여 슬라이드를 만들려고합니다. 은 높이에서 시작합니다 height: 0; . 호버시 height:auto; . 하지만 이로 인해 전환이 아닌 단순히 나타나게됩니다. height: 40px; height: auto; height: 0; 까지 올라갑니다. , 갑자기 올바른 높이로 점프합니다. JavaScript를 사용하지 않고 어떻게 할 수 있습니까? #child0 { height: 0; overflow: hidden; background-color: #dedede; -moz-transition: height 1s ease; -webkit-transition: height 1s ease; -o-transition: ..

CSS 표시 속성의 전환

질문 : CSS 표시 속성의 전환 저는 현재 CSS '메가 드롭 다운'메뉴를 디자인하고 있습니다. 기본적으로 일반 CSS 전용 드롭 다운 메뉴이지만 다른 유형의 콘텐츠를 포함하는 메뉴입니다. 현재 CSS 3 전환은 'display'속성에 적용되지 않는 것으로 보입니다 display: none 에서 display: block (또는 어떤 조합)으로도 전환 할 수 없습니다. 누군가가 최상위 메뉴 항목 중 하나를 가리킬 때 위 예제의 두 번째 계층 메뉴가 '페이드 인'하는 방법이 있습니까? visibility: 속성에서 전환을 사용할 수 있다는 것을 알고 있지만이를 효과적으로 사용하는 방법을 생각할 수 없습니다. 나는 또한 높이를 사용해 보았지만 비참하게 실패했습니다. JavaScript를 사용하여이 작업을 ..

728x90
반응형