작업 소스들 45
Javascript&CSS〃웹사이트 로딩중 이미지

이번글은 웹사이트나 홈페이지에서 이미지나 CSS, JavaScript 등을 전송받을때 로딩중 이미지를 띄우는 방법입니다. 아주 간단하게 자바스크립트와 CSS로만 만들어서 메인페이지나 쓰고자 하는 페이지에 간단히 복사 붙여넣기로 적용만 시키면 됩니다. ■ 로딩 이미지 만들기 1. http://preloaders.net/ 여러가지 로딩 이미지를 제공합니다. 2. http://www.ajaxload.info/ 쉽고 간단한 로딩 이미지를 만들 수 있습니다. ■ 로딩 소스 위에서 로딩이미지를 생성하셨다면 다음은 소스를 입혀줄 차례입니다. 먼저 CSS소스 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 다음은 SCRIPT 소스 ? 1 2 3 4 5 마지막으로 HTML or ..
작업 소스들 2020.06.16

[css] 모바일 브라우저 상단 색상을 지정해보자

삼성 기본 브라우저와 크롬 브라우저의 경우 위와 같이 상단바와 하단 메뉴 색상을 지정할 수 있습니다. 방법은 매우 간단합니다. 사이에 위 코드를 넣으시면 됩니다. 색상코드는 #CA2327 과 같은 컬러 HEX 코드를 하세요! XE 레이아웃에서는 아래와 같이 레이아웃 파일에 코드를 입력하시면 됩니다. {@ Context::addMetaTag('theme-color', '#CA2327'); } 참고로 모든 브라우저에서 지원하는 것이 아니니... 일단 기본적으로 크롬, 안드로이드 코드인 것 같더라구요.. 아마 안드로이드 기반에서만 적용되지 않을까 생각되네요 ㅎ 별 건 아니지만 자신의 사이트를 강조할 수 있습니다!!+_+ ^__________^* 좀 더 확인해보니 안드로이드 롤리팝부터 지원하는 것 같습니다 :)
작업 소스들 2020.05.28

CSS / CSS로 문자열 자르기 - 한 줄인 경우, 여러 줄인 경우

웹페이지에 출력하는 문자열의 길이는 서버단에서 조절하는 게 보통입니다. 하지만, 어떤 경우에는 그게 불가능할 수 있습니다. 이미 전송 받은 문자열을 잘라야 하는 상황이 생길 수 있습니다. CSS를 이용하여 문자열의 일부만 보여주는 방법을 소개해드립니다. 한 줄인 경우 예제 문자열이 길면 다음처럼 화면 끝에서 줄바꿈되는 것이 기본 모양입니다. 줄바꿈 되지 않게 하기 white-space 속성으로 줄바꿈이 되지 않도록 합니다. white-space: nowrap; 화면 크기를 벗어나므로 가로 스크롤바가 생깁니다. 화면을 벗어난 문자열 보이지 않게 하기 overflow 속성으로 화면을 벗어난 문자열이 보이지 않게 합니다. overflow: hidden; 말줄임표 넣기 text-overflow 속성으로 말줄임표..
작업 소스들 2020.05.22

스크롤을 감지하여 사이트의 헤더를 보이거나 숨기기는 기능

https://webdir.tistory.com/481 스크롤을 감지하여 사이트의 헤더를 보이거나 숨기기 앞서 유사한 기능의 플러그인인 Headroom.js 에 대하여 살펴보았는데, 구형 IE에 대한 크로스브라우징에 어려움을 겪을 수 있습니다. 이에 원리는 유사하나 대상 요소가 명확하게 한정된 요소일때 � webdir.tistory.com http://jsfiddle.net/mariusc23/s6mLJ/31/ Hide header on scroll down, show on scroll up - JSFiddle - Code Playground jsfiddle.net 위 사이트 참고
작업 소스들 2020.05.18
1 2 3 4 5
더보기

티스토리툴바