본문 바로가기

각 종 it/티스토리 등 프로그래밍

html 객체 위치 설정 할 때 암것도 모르는 초보자들이 행할 수 있는 실수(position 태그의 중요성) 로 레이아웃을 만들어 많은 그림을 넣어보니 가로로 일렬로 나열 되어 있다. 그럼, style top이나 right로 지정하면 되겠지 하고 코드를 써 넣어도 변화가 없다...만약 세로로 그림을 나열하고 싶다면 간단하게 width를 좁게 설정하면 된다. 그럼 어쩔 수 없이 좁혀진 레이아웃에 맞춰 그림이 세로로 나열 될 것이다. 하지만 그림을 겹치게 나열 하려면 어떻하지?이럴 때 필요한 것이 position 속성 이다.position 속성에는 기본 적인 static, 객체 관계로 위치를 잡아주는 relative, fixed와 비슷하지만 상위의 레이아웃을 참조하여 절대적인 자리를 잡아주는 absolute, 마지막으로 걍 myway, 상위에 관계없이 절대적인 자리를 잡아 드시는 fixed가 있다.이들 중 마음에 ..
html 홈페이지 폰트를 함 바꿔보자. with 구글폰트 폰트는 굳이 화려 할 필요가 없다. 의미 전달만 하면 되니. 그래도 가끔은 기분 전환 할 겸 폰트를 바꿔 주는 것도 나쁘지는 않다. 현재 페이지 상단을 보면 제목 폰트, 그 中 숫자와 알파벳 기타 기호의 모양이 바뀐 것을 알 수 있는데 바꾸면 그런 느낌이다.본디 오로치마루 옆에 있는 버튼 글자를 바꿀 생각이였지만 가독성도 무척 낮아졌고 더군다나 모바일에서는 지원이 안 된다는 큰 한계점으로 인해 일단 나두기로 했다.바꾸는 방법은 여러 가지가 있으나 구글 폰트를 기본으로 2가지만 설명하도록 하겠다.2가지 방법 다 간단하다. 구글폰트로부터 코드를 따 온 다음 붙이고자 하는 페이지에 어느정도 틀만 잡은 다음 붙여넣기하면 끝난다. 첫째, css를 따로 만들지 않고 html 안에서 해결하기. 글자체가 바뀝니다. h..
JavaScript 변수를 코드 속에 넣어보자. 우선 변수란 무엇인가? 변하는 수(숫자)이다. 숫자라 말했지만 여기 안에는 글자도 들어 갈 수 있는데 쨌든 기계는 숫자로 인식하기 때문에 수라 말해도 된다.자바에는 여러 가지 속성, 그니까. String, long 등이 있는데, 자바스크립트에서는 아직 var만 써도 크게 불편함이 없기 때문에 오늘은 var를 예시로 들도록 하겠다. 변수란 코드 안에서 동적으로 이용하는 변수를 뜻한다.변수는 프로그래머가 마음만 먹으면 언제든지 그 내용물을 바꿀 수 있다.함수를 이용해서 기존 변수를 바꿔도 되고, var width=window.innerwidth();전역 변수 선언 후 코드 작성 中 지역변수로서 임의로 바꿔도 된다. var i;fuction is(){i=1;} 그렇다면, 이 변수를 코드 안에 넣으면 어떻게 될..
JavaScript window.open() 여러 팝업창(멀티 팝업창) 소환 자바의 함수로 window.open()이 있다.이를 사용하면 팝업창 형식으로 새 창이 소환 되는데, 한 가지를 간과하고 하나의 html에서 여러 window.open()을 사용하면 새 창들이 뜨지 않고 하나의 팝업창 속에서 그 여러 창들이 소환 되는 것이다. 그 한 가지는 바로,window.open() 속성 中 이름 지정이다.window.open(URL,이름,크기,위치,기타 등 등)으로 그 속성이 이루어져 있는데, 이 中 이름을 같은 것으로 지정하게 되면 하나의 팝업창 속에서 번갈아서 소환된다.만약 다중 팝업 창을 구현 하고 싶다면,ex)window.open(‘URL’,‘zelaw’), window.open(‘URL’,‘zelaw2’) 이렇게 이름을 달리하면 간단하게 해결 할 수 있다. 이에 대해 다음 ..
구글 에드센스 지급 이름 변경 && 은행별 swift code(해외송금식별코드) 티스토리, 조금만 신경 쓰고 관리하니, 수익이 잘 들어온다. 음...3달에 벌 수 있는 금액을 한달에 버는 느낌? 여기다 다음 에드핏도 설치하니, 금액은 만족스럽지 못하지만 부수익도 생긴다.(이 참에 다른 광고들도 달아볼까?) 그러던 中 거래은행에서 금융 실명의 강화의 이유로 송금 이름을 한글 이름에 가깝게 변경하라는 요청이 들어온다. 그것도 구글에... 이 사람 최소 구글 이용 해 본적이 없거나 구글에 문의전화 해 본 적이 없는 사람이다.외국계열 서비스사들은 마! 페이스북이나 트위터, 구글은 마! 고객센터 전화번호 같은 거 없어, 왜 이래~... 그래서 왠만하면 사용자끼리끼리 해결 해야 한다.우선 기존의 지급 결제 수단을 수정 해 볼까?안 된다. 한글은 당연히 안 받아주고, 영어로도 이름 수정이 안되고..
마루 tv 기반으로 tv 프로그램 검색창을 만들어 보자. 아무리 좋은 프로그램을 선별하고 추천하더라도 모든 이들의 만족감을 충족 못한다. 마치 대게 소개 할 때 처럼.적당한 크기의 대게를 소개하면, '너무 작다'며 불평하고, 그래서 막상 크고 좋은 거 보여주면, 비싸다고 그냥 가고...(이게 비싸면 다른 곳에서는 못사먹는다.) 정말 어렵다. 그래서 걍 검색창을 달았다.요렇게.들어가는 방법은 오른쪽 하단에 tv 아이콘을 눌러주면 된다. 만약 데스크탑이라면...요기로 이동 하는데, 하얀 검색창에 보고 싶은 드라마 적고 click 누르면 된다. 그럼 이렇게 결과값이 출력되고 방송을 즐기면 된다. 만드는 방법은 간단하다.input 태그로 입력공간을 만들고, button 태그에 아이디를 부여한 다음 그 아이디를 이용 자바스크립트를 만들어 그 자바스크립트 안에서 inpu..
png 이미지 크기를 줄여주고 거기다 gif도 만들어 주는 온라인 포토에디터(아이러브이미지, 에니메이티드 에디터, 비디오프레소, 온라인비디오커터) 당장 지금 보고 있는 홈페이지에 여러 이미지가 사용된다. 옛날이야기지만 그 때는 오고 가는 데이터 속도가 느려 이미지 크기를 줄여주는 것이 바람직하나, 요즘은 그렇지 않다. 그래도 뭔가 찝찝하다면 이미지 용량이나 크기를 줄여주는 것도 나쁘지 않은 것 같아 소개하는 바이다. https://www.iloveimg.com/ko 사진을 참고하면 여러가지 기능이 있음을 알 수 있다. 당장 눈에 띄는 기능은 gif 만들어 주는 것과 워터마크 찍어주는 것이다. 포토샵이 있고 잘 다룰 줄 안다면 알 필요가 없지만, 포토샵이 없는 환경에서 인터넷만 연결 되 있다면 간단한 작업환경이 만들어 진다는 점에서 유용한 사이트라 할 수 있다. 또 업로드과정만 빼면 내 컴퓨터 고생 시킬 필요 없이 서버가 다 처리하니, 몇 번이고 만..
셔플로 시작하고 반복 재생하는 유튜브 플레이리스트, randomtube 2019/02/14 - [각 종 it] - 블로그든 뭐든 홈페이지에 BGM, 배경음악 넣어보자. 걍 유투브음악 전용 사이트를 팝업 시키는 방법임.얼마 전에 홈페이지에 BGM을 넣어보았다.그러다 유튜브기반인 최신가요 TOP 100에 대한 지루함을 느끼게 되었고, 나만의 유튜브 플레이리스트를 만들어 BGM으로 넣었었다. 그러다 또 매번 음악을 바꿔줘야 한다는 압박감에 http://www.youtube.com/embed/videoseries?list=PL9C5815B418D1508E&index=7이 코드를 활용하여 대충 랜덤 자바문 연성하여 활용하려 했으나... 한곡 반복 기능도 없고 index 수가 늘어남에 따라 코드 변경 해야 하는 귀찮음을 생각하여 다음으로 이 코드를 고려 해 보았으나, 안 된다... 오..