해 볼 것 — 그대로 보십시오. 글 줄이 끊김 없이 흐릅니다. 마우스를 올리면 멈춥니다.
해 볼 것 — 천천히 아래로 스크롤해 보십시오. 카드가 위로 하나씩 쌓입니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 이 구역에서 스크롤하며 화면 맨 위 상단바 밑의 주황 막대를 보십시오. 읽은 만큼 찹니다.
아래로 내리면 늘고 위로 올리면 줄어듭니다. 이 사이트 전체에 켜져 있습니다.
해 볼 것 — 마우스를 사진 위에 올려 보십시오. 사진이 칸 안에서 커집니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — «다시 보기» 를 누르십시오. 사진이 가운데서 펼쳐지며 나타납니다.
해 볼 것 — 이 구역에서 아래로 조금 내렸다가 위로 올려 보십시오. 상단바가 줄고 숨었다가 다시 나옵니다.
내리면 상단바가 얇아지고 사라집니다. 조금이라도 올리면 곧바로 다시 내려옵니다.
해 볼 것 — 버튼을 눌러 다른 화면에 갔다가 «돌아가기» 를 누르십시오. 화면이 부드럽게 녹아 바뀝니다.
해 볼 것 — 아래 글 속 링크에 마우스를 올려 보십시오. 밑줄이 왼쪽부터 그어집니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
해 볼 것 — 버튼에 마우스를 올려 보십시오. 글자가 위로 굴러 바뀝니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
해 볼 것 — 천천히 아래로 스크롤해 보십시오. 아래 두 구역이 화면 가운데에 오면 화면 바탕색이 바뀝니다.
이 구역이 가운데에 오면 화면 바탕색이 바뀝니다 — 하나.
여기서는 또 다른 바탕색으로 바뀝니다 — 둘.
해 볼 것 — 버튼을 누른 뒤 조금 더 내려 보십시오. 본문이 위로 걷히며 뒤에 고정된 바닥글이 드러납니다.
해 볼 것 — 마우스를 카드 위에서 움직여 보십시오. 커서 자리에 빛이 따라옵니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 마우스를 카드 위에서 움직여 보십시오. 카드가 커서 쪽으로 기웁니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 마우스를 칸 위에 올려 보십시오. 올린 칸이 살짝 커지고 나머지는 옅어집니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
해 볼 것 — «다시 보기» 를 누르십시오. 가운데 카드부터 바깥으로 차례로 나타납니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 천천히 위아래로 스크롤해 보십시오. 카드가 들어올 때 옆에서 날아들고, 위로 빠질 때 날아 나갑니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — «다시 보기» 를 누르십시오. 무작위 글자가 제 글자로 풀립니다.
예시 문장입니다.
해 볼 것 — 그대로 보십시오. 강조 문구가 한 글자씩 쳐지고 지워지며 바뀝니다.
예시 문구입니다.
해 볼 것 — 이 판의 바탕을 보십시오. 고운 입자 질감이 깔려 있습니다.
바탕 전체에 잡음 질감이 깔립니다. 예시 판입니다.
해 볼 것 — 이 판의 바탕을 잠시 보십시오. 빛 덩어리가 아주 천천히 떠다닙니다.
빛 두 겹이 26초 · 34초 주기로 움직입니다. 예시 판입니다.
해 볼 것 — 그대로 보십시오. 칸 테두리를 따라 빛이 돕니다.
해 볼 것 — 마우스를 카드 근처에서 움직여 보십시오. 커서 쪽 테두리가 빛납니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 카드 아래 «뒤집기» 버튼을 눌러 보십시오. 카드가 뒤집혀 뒷면 설명이 보입니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 아래 표를 옆으로 밀어 보십시오. 더 볼 것이 남은 쪽 끝에 그림자가 생깁니다.
검색 결과가 없습니다.
둘째 줄에 끊기지 않는 긴 값을 넣어 표가 화면 폭을 넘칩니다. 예시 표입니다.
| 첫째 줄 | 예시 내용입니다. |
|---|---|
| 둘째 줄 | MARTHAMOTIONSHOWCASEEXAMPLEVALUE0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ |
해 볼 것 — 이 예제에서는 볼 수 없습니다. 아래 안내를 보십시오.
캐러셀 점은 게시판 목록의 가로 줄에 붙습니다. 이 예제는 서버 없이 도는 파일이라 게시판 글을 받아 올 수 없어 가로 줄이 생기지 않습니다. 설정은 켜 두었습니다(크롬 135 이상).
해 볼 것 — 그대로 보십시오. 회색 뼈대 위로 빛이 지나갑니다(목록을 불러오는 동안의 모습).
예시입니다 — 실제로는 게시판의 글이 나옵니다.
해 볼 것 — 버튼을 눌러 보십시오. 누른 자리에서 물결이 퍼집니다.
해 볼 것 — «다시 보기» 를 누르십시오. 글자가 한 번 출렁이며 나타납니다.
해 볼 것 — 천천히 아래로 스크롤해 보십시오. 단어가 하나씩 진해지며 문장이 채워집니다.
스크롤을 내리면 단어가 하나씩 진해지며 문장이 채워집니다. 예시 문장입니다.
해 볼 것 — «다시 보기» 를 누르십시오. 자리마다 숫자가 굴러 멈춥니다.
해 볼 것 — 천천히 아래로 스크롤해 보십시오. 세로 선이 그어지며 점이 차례로 켜집니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 천천히 아래로 스크롤해 보십시오. 화면이 멈춘 채 카드가 가로로 흘러갑니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 천천히 아래로 스크롤해 보십시오. 사진이 커지며 화면을 채웁니다.
예시 문구입니다.
해 볼 것 — 이 예제에서는 볼 수 없습니다. 아래 안내를 보십시오.
목록 카드의 사진과 글 상세 화면의 첫 사진을 이어 그리는 효과입니다. 둘 다 서버에서 글을 받아 그리므로 이 예제에서는 짝이 생기지 않습니다. 설정은 켜 두었고, 화면 넘김(7번)은 그대로 돕니다.
해 볼 것 — 상단바 오른쪽 ☰ 버튼을 눌러 보십시오. 메뉴가 화면 전체를 덮으며 열립니다(Esc 로 닫힘). 상단바가 숨어 있으면 위로 조금 올리면 나옵니다.
이 예제는 메뉴가 많아 넓은 화면에서도 ☰ 하나로 접힙니다.
해 볼 것 — 버튼 셋 중 하나를 눌러 보십시오. 그 커튼으로 다음 화면이 들어옵니다.
해 볼 것 — 커서를 버튼 가까이 천천히 가져가 보십시오. 버튼이 커서 쪽으로 살짝 끌려옵니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
해 볼 것 — 빠르게 스크롤했다가 멈춰 보십시오. 흐르는 줄이 빨라졌다가 다시 가라앉습니다.
해 볼 것 — 아래 화살표를 누르거나 카드를 옆으로 끌어 보십시오. 원통처럼 돕니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — «다음» 을 누르거나 맨 위 카드를 옆으로 끌어 보십시오. 카드가 넘어가 맨 뒤로 갑니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
예시 문구입니다. 실제 내용은 고객사 자료로 채웁니다.
해 볼 것 — 그대로 보십시오. 오른쪽 원을 따라 글이 돕니다.
윗줄 작은 글씨가 도장처럼 돕니다. 예시 문구입니다.
해 볼 것 — 상단바 ☰ 버튼을 눌러 보십시오. 세 줄이 ✕ 로 바뀌고, 닫으면 돌아옵니다. 상단바가 숨어 있으면 위로 조금 올리면 나옵니다.
버튼 모양이 바뀌는 것을 보십시오.
해 볼 것 — «다시 보기» 를 누르십시오. 흩어진 글자가 제자리로 모입니다.
해 볼 것 — 넓은 화면에서 천천히 스크롤해 보십시오. 가운데 기둥만 반대 방향으로 흐릅니다(좁은 화면에서는 멈춘 격자).
해 볼 것 — 이 예제에서는 볼 수 없습니다. 아래 안내를 보십시오.
사이트에 «가변 글꼴»(굵기 범위가 있는 글꼴)을 더했을 때만 켜집니다. 저장소에 가변 글꼴 파일이 없어 엔진이 표시 자체를 내지 않습니다.
해 볼 것 — 이 예제에서는 볼 수 없습니다. 아래 안내를 보십시오.
사례 · 소식 목록의 글에 마우스를 올리면 그 글의 대표 사진이 커서 옆에 뜹니다. 글은 서버에서 받아 그리므로 이 예제에서는 보여 드릴 글이 없습니다.
해 볼 것 — 대문 위에서 마우스를 크게 움직여 보십시오. 지나간 자리에 사진이 차례로 남았다 사라집니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
대문에 넣은 사진들을 돌려 씁니다.
해 볼 것 — 버튼에 마우스를 올렸다가 빼 보십시오. 들어온 쪽에서 색이 번지고 나간 쪽으로 빠집니다. (마우스가 있는 화면에서 — 휴대폰은 해당 없음)
해 볼 것 — 천천히 아래로 스크롤해 보십시오. 화면이 선 채 내린 만큼 영상이 앞으로 재생되고, 올리면 되감깁니다.
해 볼 것 — 넓은 화면에서 천천히 아래로 스크롤해 보십시오. 흩어진 사진이 한 줄로 모였다가 격자로 늘어섭니다(900px 이하는 처음부터 격자).
해 볼 것 — 넓은 화면에서 천천히 아래로 스크롤해 보십시오. 사진 한 장이 아래 구역들로 옮겨 가며 오른쪽 → 왼쪽 → 위 → 뒤로 자리와 크기를 바꿉니다(900px 이하는 제 자리에 선 사진).
이 구역이 화면 가운데에 오면 사진이 오른쪽 자리로 옮겨 옵니다. 예시 글입니다.
글 자리는 사진만큼 비워 둡니다. 예시 글입니다.
사진이 작아져 글 위에 섭니다. 예시 글입니다.
마지막 자리에서 멈춥니다. 예시 글입니다.