본문 바로가기
반응형

분류 전체보기268

[JS] Swiper https://swiperjs.com/ Swiper - The Most Modern Mobile Touch Slider Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com Swiper에는 다양한 옵션들이 있습니다. 옵션을 사용하면 마우스로만 움직이는 슬라이드를 버튼 클릭으로 움직이게 하거나, 아무런 동작을 하지 않아도 자동으로 슬라이드가 넘어가게 하는 등 사용자가 더 편리하게 이용할 수 있습니다. 사용 방법 사이트 접속해서 다운 받기 alpha가 아닌 파일 다운 받기 사이트 링크로 파일 불러오기 4. 기본 레이아웃 추가 Sl.. 2023. 10. 11.
[JS] GSAP 웹 개발하는데 생각보다 이곳 저곳에서 소스를 많이 긁어오는구나 싶다… 임베디드 했을 때는 이런거 없이 전부 코딩했었는데, 새롭다! GSAP 바로가기 ↓↓↓↓↓↓↓↓↓ https://greensock.com/docs/v3/Installation GSAP Greensock에서 제공해주는 자바스크립트 애니메이션 라이브러리라고 한다. 상당히 복잡한 애니메이션 구현이 가능해서 매우 인기라고 한다. 사용방법은 이전 것보다 살짝 복잡하다. 우선 저 사이트로 들어가서 GSAP을 설치해야한다. 그 다음 원하는 플러그인을 고르면 코드가 보여지는데, 이 코드를 사용하면 된다. HTML에 위에 코드까지 적으면, JavaScript에서 하기와 같이 사용이 가능하다. /** * 페이지 스크롤에 따른 요소 제어 */ // 페이지 .. 2023. 10. 11.
[HTML] 구글 머터리얼 아이콘(Google Material Icons) 지난 포스트 ‘구글 폰트’에 이은 유용한 사이트 추가!! 구글 머티리얼 아이콘 바로가기 ↓↓↓↓↓↓↓↓↓ https://fonts.google.com/icons?selected=Material+Icons => head 태그 안에 위 코드를 추가한다. 구글 폰트와 마찬가지로 코드가 나온다. 이건 이미지이기 때문에 SVG나 PNG 이미지를 다운받아서 사용해도 된다. 2023. 10. 11.
[HTML] 구글 폰트 웹페이지를 만들다보면 이쁜 폰트를 사용하고 싶은 경우가 있다. 그럴 경우에는 ‘구글 폰트’를 이용하면 된다. 구글폰트 바로가기 ↓↓↓↓↓↓↓↓↓ https://fonts.google.com/ Browse Fonts - Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com 원하는 폰트를 선택한 후, 원하는 크기와 굵기의 글씨까지 선택하면 옆에 코드가 나오는데, 저 코드를 그대로 사용하면 원하는 폰트를 손쉽게 사용할 수 있다. 2023. 10. 11.
반응형

티스토리툴바