본문 바로가기

이미지6

[Bootstrap] 부트스트랩과 CSS로 이미지 위에 글자 보여주고 overlay되게 하기 See the Pen Bootstrap/CSS transparent text on image by Woojin Choi (@woojin-choi) on CodePen. 부트스트랩과 CSS 이용해서 브라우저 크기 조절하면 이미지가 브라우저 크기에 맞게 바뀝니다. 이미지 위에 반투명으로 글자가 보이고 마우스를 이미지 위에 올리면 글자가 이미지 전체에 overlay 됩니다. 2018. 12. 17.
[CSS] 이미지 위에 글자(텍스트) 보여주기 샘플 예제 (반투명) See the Pen text mouseover on image with transparent by Woojin Choi (@woojin-choi) on CodePen. 이미지 위에 글자 보여주는 소스에요. 이미지는 원하는 url로 바꿔주시면 됩니다. 2018. 12. 17.
[Java/jsp] 자바로 이미지를 base64 인코딩 소스로 변환하는 함수 자바로 이미지를 base64 인코딩 소스로 변환하는 함수입니다. 필요하실 때 참고하세요. 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051public static String getBase64String( String[] imageUrl, String content ) throws Exception{ if( imageUrl.length > 0 ) { int imageUrlLength = imageUrl.length; String[] imageString = new String[ imageUrlLength ]; for( int i = 0; i 2015. 12. 26.
Ajax 로딩바 원하는 이미지 만들어주는 사이트 로딩바는 어디서든 많이 사용하는데요.Ajax로 데이타를 불러오는 과정에서 많이 사용하고 있는데요. 이런 로딩바를 원하는 이미지, 원하는 색상으로 만들어주는 사이트가 있어서 소개해 드립니다.http://www.ajaxload.info/ 이곳에 들어가시면.. 이미지와 색상을 선택할 수 있는데요. 이미지와 색상을 선택하고 나서 [Generate it !] 버튼을 클릭하시면 선택했던 이미지가 만들어져서 화면에 보여집니다. [Download it !] 클릭하시면 해당이미지를 다운로드 받으실 수 있습니다. 2015. 8. 26.
티스토리에서 이미지가 너무 커서 화면을 벗어날 때 이미지 사이즈 줄이는 방법 티스토리에 글을 올릴 때 이미지를 많이 올립니다. 저의 경우에는 화면캡쳐를 많이 하게 되는데 종종 이 화면캡쳐한 이미지가 너비가 너무 커서 화면을 벗어나곤 합니다. 이렇게 화면을 벗어나는 경우에는 글쓰기 화면에서 [HTML에 체크]를 하시고 이미지의 width를 티스토리 글보기 화면 너비에 맞게 적당히 줄여주시면 됩니다. 제 블로그에서는 사이드바를 제외한 글보기 화면의 너비가 760px이라서 이미지의 width='680"으로 했습니다. 그리고, 이미지의 height는 반드시 지워야 합니다. 자, 이렇게 width를 줄여주고 height를 삭제하면, 이미지가 화면에 맞게 잘 나오게 됩니다^^ 티스토리에서는 HTML만 살짝 손보면 내 생각대로 많은 부분들을 구현할수가 있답니다. HTML도 틈틈이 공부해 보세.. 2014. 12. 5.
[jQuery] 제이쿼리로 ajax 호출시 로딩중 이미지 보여주기 jQuery로 ajax 호출시 로딩중 이미지를 띄워주려면 어떻게 할까? 바로 이런 화면을 구현해 볼까한다. [호출] 버튼을 클릭하면 구구단 1단을 ajax로 불러오고 불러오는 동안 '로딩중' 이미지를 보여준다.자, 그럼.. 먼저 index.html 페이지를 만들어보자. 구구단 1단을 호출하자. ~ 사이에 위와 같이 모양을 만들고 사이엔 다음과 같이 넣어서 로딩이미지의 위치 및 투명도를 조절해보자.123456789cs [호출] 버튼을 클릭하면 fLoadData() 라는 함수가 호출되는데, 이 함수가 ajax로 데이타를 불러오는 부분이다. 사이에 자바스크립트를 추가해보자.123456789101112131415161718 function fLoadData() { $.ajax({ type: "POST", url.. 2010. 10. 14.