본문 바로가기

각 종 it

컴퓨터 마우스 커서 흔적 남기는 애니메이션 효과 컴퓨터에 돌아다니는 마우스 커서, 이외에도 포인터라고도 불린다. 많은 수의 검색기를 등록 해 놓은 탓에 가끔씩 어떤 북마크를 눌렀는지 아니면 뭘 눌렀는지 헷갈릴 때가 있다. 그것도 그럴 것이 검색기들을 복붙 해 놓아서 글자만 달랐지 모양이나 색깔이 똑깥다. 이에, 웹상의 마우스 포인터의 누른 흔적을 남기기로 했다. See the Pen Pikachu Loading Page by Hazem Ashraf (@Tetsu) on CodePen. 대략적으로 이런 느낌이다. 지금도 마우스 끝에 노란 다마가 움직이고 있을 것이다. 클릭 순간! 노란 다마가 흔적을 남기는 그런 간단한 효과다. 오른쪽 고양이 캐릭터에 맞게 검은 발자국을 만들면 더 그럴싸 하겠다. 이 코드를 그대로 가지고 오면 안 된다. 위 코드는 로딩 ..
흐르는 글자 css == marquee css 보완 버전 는 곧 없어진다. 이에 css로 marquee를 표현한 게시글이 많다. 아쉽게도 예전만큼 인기가 높지 않아, 다들 적당히 만든 것 같아 필자가 약간 보완해 보았다. 대부분의 marquee css에서는 마우스 온 스탑을 구현하지 않았다. See the Pen Marquee CSS by nanati (@nanati) on CodePen. 출처 : https://nanati.me/css3-marquee/ marquee를 충실하게 구현하였지만, 배경 색깔이 탁하다는 것과 width가 600px로 제한되었다는 것에 한계를 가진다. 이에 이 것을 그대로 사용하기에는 반응형 웹페이지에서는 다소 무리가 있어 보인다.. 이를 해결하기 위해서는 배경 색깔을 없애거나 투명 코드로 대체해야 하고 width를 수정해야 꽉 찬m..
스트리밍 가격비교 사이트, 이 영상 지금 어느 스트리밍 사이트에서 합법적으로 상영 중 이죠? 요즘은 동영상조차도 mp3처럼 쉽게 다운로드할 수 있고 스트리밍으로 시청이 가능하다. 이와 관련하여 스트리밍을 제공하는 회사가 넷플릭스, 프라임 비디오, 푹, 왓챠, 네이버스톨, 구글 플레이, 무비, 가이드 독 마지막으로 유튜브 등이 있다. 사용법 유튜브를 제외 한 이 모든 사이트들이 현재 제공하고 있는 영상을 검색 또는 가격 비교가 가능한 사이트가 justWatch다. 영화, 미드, 애니메이션 등 위 사이트들에서 다루는 영상이 있다면 여기에서 검색이 가능하다. 유튜브만 빼고. 단순 가격 비교에도 좋지만, 내가 애용하고 있는 스트리밍 사이트가 지겹고 색다른 영상을 찾고 싶다면 이용 하심이... 최신 영화나 인기 있는 것은 당연히 내가 애용하는 스트리밍 사이트에서 제공해 준다. 하지만 아무리 '최신' 그리..
disqus vs livere~디스커스 댓글 디스하기 필자가 자주 방문하는 홈페이지들이 많이 사용하기에 좋은가 싶어 티스토리에서 기본적으로 제공하던 라이브리를 뒤로 밀어 두고 디스커스를 사용해 봤다. 나쁘지는 않았다. 나쁘지는 않은데... 왜 광고를 멋대로 달고 난리야? 디자인면에서도 라이브리가 낫다. 나은데도 군중심리에 끌려 사용해 보았는데... 시간이 지나고 댓글이 조금 달리기 시작하자 광고를 멋대로 송출하고 있었다... 물론 수익을 창출시켜 주겠다는데 누가 싫어하겠는가? 거기다 언젠가 한번 달아야지 생각했던 taboola광고를 떡하니 달아줬는데, 오히려 고마웠다.(taboola에서 기막힌 상품이 나올 때가 있어 한 번 달려고 했었다.) 하지만 문제는 필자가 컨트롤할 수 없다는 것이다. looking to remove ads? upgrade your a..
html & css & js(Java Script)의 관계 html은 웹페이지의 골격, css는 디자인, js는 동적인 움직임이라고 설명해도 처음 접한 사람은 이해하기 어렵다. 이에 눈에 확 띄는 예시를 제시하고자 한다. Iframes not supported 아쉽게도 데스크탑에서만 보인다.
윈도우10 내장 프로그램으로 동영상편집하기(배경음악 바꾸기 編)~이제 윈도우무비메이커 그냥 보내줘도 될 듯. 윈도우 10 운영체제 이전에는 무비메이커라는 프로그램을 애용해 왔다. 그러던 中 더이상 무비메이커에 대한 지원이 끊어지자 공식적인 다운로드 경로도 사라졌었다. 이에 사람들은 여기저기서 최후의 버전인 무비메이커 설치 파일을 공유하기 시작했고 지금도 그러고 있다. 이 과정에서 일부 유료 동영상 편집 프로그램이 무비메이커 마냥 속이고 다운을 유도하는 사례가 발생했다.(다음 인코더도 마찬가지다.) 이제 무비메이커나 다음 인코더 찾을 필요가 없다. 바로 윈도우 10안에 내장되어 있는 프로그램, '사진'이 있다. 기본적으로 깔려있는 사진프로그램으로 편집을 원하는 동영상을 재생하거나, 해당 동영상에 오클한 뒤 사진을 선택하면 된다. 그 뒤 처음 사진처럼 상단에 있는 '편집 및 만들기'를 이용하면 동영상 편집이 가능하..
중소기업 tv로 usb 영상을 보면 어떨까?(smatra, she-430p) 이번에는 스마트라 tv usb 기능으로 영상을 보기로 했다. 메모리 카드의 용량 한계로 그 동안 흥미는 있되 보지 않았던 브레이크 블레이드를 보게 되었다. 1편이 어디있지? usb mp3에서 찾지 못 했던 랜덤기능을 동영상에서 찾을 수 있었다. 바로 동영상 재생 폴더 안에서 말이다.(재생목록이 다 뒤 섞였다.) 사진을 보면 알 수 있지만 파일 이름 크기 또한 커서 몇 편인지 구분하기도 힘든데, 여기다 파일 순서도 랜덤으로 보여주니... 얼척이 없었다.(차라리 mp3 기능에서 구현 할 일이지...) 다행히 해당 파일에 커서를 가져가면 ‘미리보기’기능을 제공하여 몇 편인지는 구분 할 수 있지만, 양이 많아지면 난감한 일이 발생 할 수도 있다.(원피스만 해도 팔백몇십편이 나왔으니까 이것을 하나의 폴더에 넣어 ..
html <title>, <alt> 언제 쓰는거고 왜 쓰는거야? html 안에는 속성이라는 것이 있다. 재미있는 것은 이 속성이 왠만하면 공통적으로 사용 할 수 있다는 점인데, 그 中에 title과 alt 태그도 포함된다. 주로 img 태그에서 많이 사용되고 그렇게 하길 권고된다. alt 태그는 대표적으로 이미지에 많이 사용되는데, 혹 브라우저가 지원을 안 해 준다든지 링크가 깨진 상황이 발생한다면! 그때 이미지를 대신해서 보여주는 문구 같은 것이다. 책에서는 시각장애인들을 위해 alt를 성실하게 기입하라고 하는데... 그 이외에는 딱히... 굳이 alt를 쓰지 않고도 태그 사이에 글자를 기입 해 줘도 어느정도 alt를 대신 할 수 있으니 말이다. (홈페이지의 style에 따라 표현되는 글자도 다르다.) 하지만! 검색엔진 트래픽이 달라진다는 점도 있다. 검색엔진이 이..