Programming/css2018. 10. 10. 19:16

css로 백그라운드만 돌리기

잘 안되네... (예제만은 잘됨.. 내꺼에는 안됨.. ㅠㅠ)

일단 핵심은 :before라는 슈도 태그 인듯..

(근데 난 d3로 svg 그리는데 zindex랑 꼬여서 영 안됨..)


body

{

font-family: arial, helvetica, freesans, sans-serif;

font-size: 100%;

color: #333;

background-color: #ddd;

}


h1

{

font-size: 1.5em;

font-weight: normal;

margin: 0;

  text-align: center;

  padding-top: 1em;

}


#element2

{

width: 12em;

font-size: 2em;

text-align: center;

line-height: 5em;

margin: 3em auto;

border: 2px solid #666;

border-radius: 7px;


  position: relative;

overflow: hidden;

}


#element2:before

{

content: "";

position: absolute;

width: 200%;

height: 200%;

top: -50%;

left: -50%;

z-index: -1;

background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/123941/background.png) 0 0 repeat;

transform: rotate(45deg);

} 


[링크 : https://www.sitepoint.com/css3-transform-background-image/]

[링크 : https://stackoverflow.com/questions/24842026/rotate-background-image-of-div-90-degrees-using-jquery]

저작자표시

'Programming > css' 카테고리의 다른 글

css transform zindex origin  (0) 2018.10.25
css tooltip 위치  (0) 2018.10.25
css 계층 구조? 상속? 선택자 조합자?  (0) 2018.09.05
sass scss  (0) 2018.09.05
hover inline css  (0) 2018.08.27
Posted by 구차니
프로그램 사용/ffmpeg & ffserver2018. 10. 10. 18:56

ffmpeg concat

ffmpeg를 이용해서 여러개의 파일을 합치는 방법

RTSP를 통하거나 m3u8 파일을 통해서 원하는 시간에 대해서 합치는 법 찾아야 하는데.. ㅠㅠ


[링크 : https://trac.ffmpeg.org/wiki/Concatenate]

[링크 : https://stackoverflow.com/.../ffmpeg-mp4-from-http-live-streaming-m3u8-file/32537953]

[링크 : https://stackoverflow.com/.../using-ffmpeg-to-save-an-rtsp-stream-from-a-certain-point-in-time?rq=1]

[링크 : http://hlsbook.net/how-to-start-playing-a-video-at-a-specific-point-in-time/]

[링크 : https://stackoverflow.com/.../ffmpeg-hls-segmenting-start-time-miscalculated]


+

2019.01.04


rtsp 주소는 concat에서 인식을 못한다...

다운로드 후 합치는걸로 구현을 해야하려나?

저작자표시

'프로그램 사용 > ffmpeg & ffserver' 카테고리의 다른 글

ffmpeg / ffplay cli interactive interface  (0) 2018.11.30
ffmpeg concat  (0) 2018.11.05
ffmpeg huffyuv  (0) 2017.02.28
ffmpeg으로 컨테이너 변경하기  (0) 2016.12.01
ffmpeg 으로 파일 재생하기  (0) 2015.02.10
Posted by 구차니
개소리 왈왈/블로그2018. 10. 10. 16:52

오랫만에 마음에 드는 티스토리 개편

정체성이 이제 불분명하던 '초대장' 시스템의 폐지

그리고 개인 블로그로서는 나쁘지 않는 상한선인 하루 30개 글 제한(기존 유저, 신규 유저 15)


#01. 새로운 스킨을 제공합니다.

#02. 홈 꾸미기를 위한 ‘커버’ 기능을 지원합니다.

#03. 이제 초대장 없이 누구나 가입할 수 있습니다.

#04. 1일 글 작성 수 제한이 생깁니다.

#05. IE 10 이하의 브라우저 지원을 중단합니다. 

[링크 : https://notice.tistory.com/2451]



그래도 기존의 초대목록이 사라지는건 좀 아쉽네.

(그래봤자 활동도 안하는 놈들 뿐이지만)

저작자표시

'개소리 왈왈 > 블로그' 카테고리의 다른 글

간만에 해피빈 기부  (0) 2019.03.08
별별 희한한 제약을 다 만들었네 -_-  (4) 2019.01.28
티스토리 선조치 후보고?  (0) 2018.07.12
읭? 티스토리 글 쓰기 개편인가?  (4) 2018.07.10
부랴부랴 도메인 연장  (4) 2018.06.11
Posted by 구차니
Programming/node.js2018. 10. 10. 16:40

node.js 정적 파일 서비스

/static 아래에서는 /public으로 연결해서 자유롭게 파일을 직접 액세스 하도록 해주는 기능



app.use('/static', express.static('public')); 

[링크 : http://expressjs.com/en/starter/static-files.html]

[링크 : http://expressjs.com/ko/starter/static-files.html]

[링크 : http://infodbbase.tistory.com/40]

[링크 : https://opentutorials.org/course/2136/11857]

저작자표시

'Programming > node.js' 카테고리의 다른 글

node tmp uuid  (0) 2018.10.12
node.js mysql PROTOCOL_ENQUEUE_AFTER_FATAL_ERROR 에러  (0) 2018.10.11
waveform 출력하는 자바스크립트 모듈  (0) 2018.10.05
xz로 압축된 node.js 설치하기  (0) 2018.10.02
npm install이 윈도우에서 안될때  (2) 2018.09.27
Posted by 구차니
프로그램 사용/네이버 맵 API2018. 10. 10. 16:38

네이버 지도 - 클릭시 마커 아이콘 변경하기

별도로 만들어 준 marker 배열을 이용해서

setIcon()을 설정해주면 됨..


e로 넘어 오는 값으로는 무리인가..


[링크 : https://developers.naver.com/forum/posts/26398]

[링크 : https://navermaps.github.io/maps.js/docs/naver.maps.Marker.html]

저작자표시

'프로그램 사용 > 네이버 맵 API' 카테고리의 다른 글

네이버 지도 위도/경도 좌표  (0) 2018.10.29
네이버 API 공지  (2) 2018.10.13
네이버 지도 zIndex 와 title  (0) 2018.10.10
네이버 지도 idle 이벤트  (0) 2018.10.10
네이버 지도 API 애니메이션  (0) 2018.10.05
Posted by 구차니
프로그램 사용/네이버 맵 API2018. 10. 10. 14:53

네이버 지도 zIndex 와 title

핸들러에서는 marker object가 아니기 때문에

overlay의 title과 zIndex 정도가 클릭시 얻을수 있는 외부(?) 정보로 사용이 가능할 것으로 보인다.


var marker = new naver.maps.Marker(

            {

                position: new naver.maps.LatLng(data.lat, data.lng),

                title : data.name,

                zIndex : i,

                map: map

            }

        ); 


        naver.maps.Event.addListener(marker, "dblclick", function (e) {            

            // console.log(e);

            // console.log(e.overlay.zIndex);

            // console.log(e.overlay.title);

            console.log(e.overlay);

        }); 

[링크 : https://navermaps.github.io/maps.js/docs/naver.maps.Marker.html]

저작자표시

'프로그램 사용 > 네이버 맵 API' 카테고리의 다른 글

네이버 API 공지  (2) 2018.10.13
네이버 지도 - 클릭시 마커 아이콘 변경하기  (0) 2018.10.10
네이버 지도 idle 이벤트  (0) 2018.10.10
네이버 지도 API 애니메이션  (0) 2018.10.05
네이버 지도 종류 선택하기(버튼)  (0) 2018.10.05
Posted by 구차니
프로그램 사용/네이버 맵 API2018. 10. 10. 11:25

네이버 지도 idle 이벤트

공식 문서에는 잘 안나오네..

아무튼 idle이벤트는 어떤 행위를 하고 나서 발생을 한다.

즉, 처음 로딩시 설정하고 무언가를 해주더라도 idle 이벤트가 발생하지 않고

마우스로 옮기는 등의 사용자 행동을 한 이후에 idle 이벤트가 발생하게 된다.


    naver.maps.Event.addListener(map, 'idle', function() {

        console.log('idle');

    }); 

[링크 : https://developers.naver.com/forum/posts/26097]

[링크 : https://navermaps.github.io/maps.js/docs/tutorial-UI-Event.html]



+

원래는 로딩시에 idle이 뜨는줄 알고

그 이후에 마커를 표시하려고 했는데 안되서 찾는중


+

UI 이벤트 목록

mousedown, mouseup, click, dblclick, rightclick, mouseover, mouseout, mousemove

dragstart, drag, dragend

touchstart, touchmove, touchend, pinchstart, pinch, pinchend, tap, longtap, twofingertap, doubletap 


[링크 : https://navermaps.github.io/maps.js/docs/tutorial-UI-Event.html]

저작자표시

'프로그램 사용 > 네이버 맵 API' 카테고리의 다른 글

네이버 지도 - 클릭시 마커 아이콘 변경하기  (0) 2018.10.10
네이버 지도 zIndex 와 title  (0) 2018.10.10
네이버 지도 API 애니메이션  (0) 2018.10.05
네이버 지도 종류 선택하기(버튼)  (0) 2018.10.05
gis 위치정보 db 타입  (0) 2018.09.11
Posted by 구차니
개소리 왈왈/모바일 생활2018. 10. 9. 20:31

다이소 5천원짜리 블루투스 스피커 구매!

걍 지름신 와서 질러버림

딸래미에게 색상 골라보라고 하니 빨간색 선택!

(흰,검,회색,빨강 있었음)


AUX 및 USB충전용 케이블(전용)

USB는 micro가 아닌 mini 라서 좀 아쉽..


무려 mp3 32GB 까지 가능! 하다는데 흐음..



아무튼 소리가 그리 적지도 않고 나쁘지 않은데

단지 볼륨 조절 스위치가 꾸욱 누르고 있어야 한다는건 좀 에러

(대개는 꾸욱 하고 있으면 다음곡/이전곡임)



300mAh 정도의 배터리로 얼마나 버텨줄진 모르겠지만

다이소에서 집에 오는 20여분 딸래미에게 만화 틀어주면서 소리가 잘들리니 좋아함 ㅋㅋ

(핸드폰 스피커가 후면으로 크게 나와서 자꾸 가까이 보는게 신경쓰이니..)



+

그나저나.. BT 모듈 + 케이스 + 배터리 + 스피커 + 3W 앰프..

다 합쳐도 5천원보다 비쌀듯.. ㄷㄷ 무슨 마법을 부린거냐...

저작자표시

'개소리 왈왈 > 모바일 생활' 카테고리의 다른 글

다음 아고라 서비스 종료  (4) 2018.12.04
갤럭시 S4 Active 무선충전 패드 설치  (6) 2018.10.17
inote FS-94KBT + win10 + 서피스 프로3 문제  (0) 2018.10.07
게임 튜너와 안드로이드 해상도  (0) 2018.10.03
pf1000u와 3d 안경  (0) 2018.08.28
Posted by 구차니
개소리 왈왈/직딩의 비애2018. 10. 8. 22:35

회사 워크샾 - 에버랜드

빡세다 -ㅁ-


다른거 보다.. 왜! 샌드위치인가 닝겐들이 죄다 여기 몰린 느낌인건가.. ㅠㅠ

사파리 하나 보겠다고 서있는데 3시간 훅~ ㅠㅠ

저작자표시

'개소리 왈왈 > 직딩의 비애' 카테고리의 다른 글

우울할 땐 아내 몰래 하나 지르자~  (1) 2018.10.23
단풍이 절정이라는데..  (2) 2018.10.20
9월의 끝  (2) 2018.09.30
읭? 타겟 광고인가?  (4) 2018.09.28
쓸데없는 지름신 목록  (4) 2018.08.26
Posted by 구차니
Programming/javascript & HTML2018. 10. 7. 20:35

html canvas 크기

화면상에 보이는 실제 크기

document.getElementById('video-canvas').scrollWidth

document.getElementById('video-canvas').scrollHeight


캔버스 자체의 실제 크기

document.getElementById('video-canvas').width

document.getElementById('video-canvas').height



jsmpeg을 통해서 동영상을 틀어 주면 동영상의 실제 크기는 width, height로 나오고

scrollWidth, scrollHeight는 canvas 태그에 의해서 설정된 width, height 값이 나오게 된다.


+

jquery에서 셀렉터로 하면 width를 못 받아온다. 왜그럴까..

저작자표시

'Programming > javascript & HTML' 카테고리의 다른 글

css & jquery animation  (0) 2018.10.11
jquery / js로 배경이미지 변경하기  (0) 2018.10.11
html5 canvas crop & save  (0) 2018.10.04
json2xls 사용 주의  (0) 2018.10.02
json key 추가/삭제  (0) 2018.09.28
Posted by 구차니

티스토리툴바