에티테마

외부이미지링크 마음대로 가져다 쓸 수 있는 방법

페이지 정보

작성자 소프트존 쪽지보내기 메일보내기 자기소개 아이디로 검색 전체게시물 댓글 0건 작성일 19-07-08 17:47
라이센스 라이센스를 입력하지 않았습니다 파일내 포함되어 있는 문서를 참고해주세요.
데모 데모 (4251)
다운로드 다운로드 (0)
개발사

본문

이미지를 일일이 올려서 편집하고 ftp 로 업로드하고 보게되면
시간도 많이 걸리고 불편하고, 이미지도 찾아야 하는 번거로움이 많습니다.
이런경우 외부의 이미지를 원하는 사이즈에 맞게 가져다가 쓰는방법입니다.
옵션을 잘 보시면 텍스트도 들어거고 색상조정도 가능합니다.

지금 브라우저를 켜고 주소창에 

http://placehold.it/320x300
라고 입력해보세요 또는

http://placehold.it/320x500
이라고 입력해보세요. 

바로바로 이미지가 크기대로 보여지는것을 확인할 수 있습니다.
나머지는 링크타고 가셔서 해당사이트의 옵션을 살펴보시기 바랍니다.



  • 트위터로 보내기
  • 페이스북으로 보내기
  • 구글플러스로 보내기

댓글목록

등록된 댓글이 없습니다.

Total 41건 1 페이지
41

FlexSlider2 - 플렉스슬라이드2

FlexSlider2 슬라이드는 아주 쉽게 슬라이드를 구현할 수 있도록 해주는 라이브러리 입니다.html 파일과 js 파일을 예제를 쉽게 사용할 수 있습니다.좌측에 샘플 메뉴를 제공해주기 때문에 초보자도 쉽게 따라할 수 있습니다.

40
CSS 네이티브 형식의 이쁜 라디오버튼, 체크박스등

CSS 네이티브 형식의 이쁜 라디오버튼, 체크박스등

데모 버전에서는 아래처럼 3가지를 불러들이지만 ...     <link rel="stylesheet" href="demoDist/demo.css">    <link rel="stylesheet" href="demoDist/prism.css">    <link rel="stylesheet" href="dist/css/checkboxes.css"&g…

39
글작성 또는 글쓰기시 재미있는 캡챠 코드

글작성 또는 글쓰기시 재미있는 캡챠 코드

기존 캡챠 코드와는 약간 다른 아이디어가 묻어 있는 캡챠코드 네요~드래그 해서 숫자의 배열을 맞춰야 글을 작성할 수 있습니다.해당 코드의 경우에는 1~6개 까지 이지만 숫자를 더 추가하거나 뺄 수도 있습니다.[기존코드]  $(function() { $("#sortable").sortable(); $("#sortable").disableSelection(); $('ul').shuffle(); …

38
텍스트박스에 있는 텍스트를 텍스트파일로 다운로드 하기

텍스트박스에 있는 텍스트를 텍스트파일로 다운로드 하기

본 라이브러리는 자바스크립트 버전과 php 버전 두개로 나뉩니다.데모버튼을 클릭해서 보시면 테스트하실 수 있습니다.감사합니다. 

37
jquery 동적 input 박스 생성 라이브러리

jquery 동적 input 박스 생성 라이브러리

sheepit 이라는 자바스크립트 라이브러리 입니다.동적 폼을 생성해 주는 간편한 라이브러리 이므로관리자 페이지나 폼양식이 많이 필요한곳에 사용하면 괜찮을듯 합니다. $(document).ready(function() {    var sheepItForm = $('#sheepItForm').sheepIt({        separator: '',        allowRemoveLast: true,      …

36

셀렉트박스 선택시 선택값 입력하기

셀렉트 박스 선택시 해당 선택값이 텍스트에나타나는 라이브러리 입니다.직접 코딩하지 않고 쉽게 만들 수 있는 라이브러리 입니다. 

35

클론박스 input 추가 및 복사후 배열처리

해당 자바스크립트 라이브러리는클론박스 입니다.input 박스에 텍스트를 입력하고 add 를 클릭하는경우에그대로 복사되서 input 박스가 한개더 생겨나게 됩니다.동적인 문서를 직접 처리하지 않아도해당 라이브러리로 쉽게 처리 가능할것 같습니다.감사합니다. 

34

새로고침 해도, 페이지를 닫더라도 텍스트가 사라지지 …

글작성시에 새로고침 하게 되면모든 글이 삭제 되게 됩니다.현재 자바스크립트 라이브러리는폼양식 입력시 autosave 기능으로 인하여페이지를 닫더라도 폼양식이 사라지지 않습니다.중요한 폼양식을 작성할경우에 필요한 라이브러리 입니다.감사합니다. 

33

textarea 박스에 글자입력시 숫자 카운트

textarea 박스에 글자를 입력하면카운터 되서 해당 스트링 만큼의 숫자가 거꾸로 출력됩니다.해당 소스코드를 확인해주세요~ 

32

자바스크립트 폼양식 라이브러리

버튼전송시(submit) 폼양식을 여러 종류별로 체크 가능합니다.데모를 확인해 보시면 쉽게 이해 하실 수 있습니다.감사합니다. 

31

jquery 파일 업로드

깃허브 자료실로 이동하여 다운로드 받으시거나(위의 깃허브 자료실 링크를 클릭해주세요.)NPM 으로 설치하여 다운로드 받습니다.npm install blueimp-file-upload[사용법]<script src="node_modules/blueimp-file-upload/js/jquery.fileupload.js"></script>$('#fileupload').fileupload();[데스크탑 브라우저 지원사항]Google ChromeApple Safari 4.0+Mozilla Firefox 3.0+Opera …

30

ajax 업로드 입니다.

해당소스코드를 확인해보시면 될듯 합니다.별다른 옵션에 대한 설명은 없습니다. <script src="/js/jquery.min.js" type="text/javascript"></script><script src="/js/ajaxupload.js" type="text/javascript"></script>위의 두개의 파일을 연결합니다.ajaxupload.js 에 대한 파일도 함께 첨부 합니다. $(document).ready(function(){  var thum…

29

슬라이딩 애니메이션 회원가입 폼양식 입니다.

회원가입 양식이 애니메이션 슬라이딩으로 구현되어 있습니다.해당 사용법은 다운로드 하신 소스코드를 확인하시기 바랍니다. 

28

CSS - ANIMATION / ANIMATE.CSS …

CSS 로 직접 애니메이션을 구현하다보면 미세조정이라든가 부드러운 효과를 내기위해서는더 많은 공부를 하거나 작업량이 대폭 늘것으로 예상됩니다.css 라이브러리로 지원되는 ANIMATE.CSS 라는 파일이 있습니다.깃허브에서 다운로드 받거나 첨부파일을 다운로드 하여 압축을 풀어 줍니다.해당 ANIMATE.CSS 에 대한 사용법에 대해서 설명하는 시간을 가져보도록 하겠습니다.우선 데모를 확인해주세요http://ety.kr/ex/css/css_animation_03.html위의 주소에 있는 효과를 내는것인데 직접 만든것보다 깔끔하고 효과…

열람중

외부이미지링크 마음대로 가져다 쓸 수 있는 방법

이미지를 일일이 올려서 편집하고 ftp 로 업로드하고 보게되면시간도 많이 걸리고 불편하고, 이미지도 찾아야 하는 번거로움이 많습니다.이런경우 외부의 이미지를 원하는 사이즈에 맞게 가져다가 쓰는방법입니다.옵션을 잘 보시면 텍스트도 들어거고 색상조정도 가능합니다.지금 브라우저를 켜고 주소창에 http://placehold.it/320x300라고 입력해보세요 또는http://placehold.it/320x500이라고 입력해보세요. 바로바로 이미지가 크기대로 보여지는것을 확인할 수 있습니다.나머지는 링크타고 가셔서 해당사…

테마몰

테마몰

카테고리

카테고리
라이브러리

라이브러리

라이브러리
CSS - ANIMATION / ANIMATE.…
FlexSlider2 - 플렉스슬라이드2