트위치 트게더 Twitogether 91812191 김준희.

Slides:



Advertisements
Similar presentations
지도교수 : 박진식 교수님 조 원 : 홍승기, 이병용, 백승준, 조근용, 조동현, 한정협, 이상하.
Advertisements

1 ‘ 우리나라의 주요공업 ’ - 정도웅, 주민혁, 안수진, 백경민, 엄다운, 박경찬 -.
수유부의 약물복용 시 주의점 발표자 조기성. 모유 수유의 장점 모유 수유의 장점은 ? 위장관 질환 발생감소 영아 돌연사 발생감소 아토피 질환 발생감소 정서적 안정.
밥 팀 명 : TTL 조 팀 원 : 김정용 (PM) 서종규 노재현 엄성욱.
미국의 미디어교육 신문방송학과 강진구 한인수 곽모란 이명현.
PRESENTATION 저온화상이란?
Chapter 16 : Struts 프레임워크 2. chapter 16 : Struts 프레임워크 2.
검색광고 Search Advertising
공부할 내용 조상들이 살던 곳 자연과 잘 어울리는 한옥 지방에 따라 서로 다른 집의 모양 섬 지방의 집
사랑, 데이트와 성적 자율성 :데이트 성폭력!!! 성폭력예방교육 전문강사 / 여성학 전공 신 순 옥.
OpenAPI의 응용 인공지능 연구실.
퇴계와 율곡의 사회사상 비교 남 일 재 동서대학교 교수/ 정치학 박사 1. 퇴계 이황과 율곡 이이의 약전(略傳)
피티라인 파워포인트 템플릿.
501. 군인들의 세상 502. 민정 이양과 한일회담 이선용.
쌓지 말고 해소하자 이 주휘 이 진영 전 민석 전 혜림.
2015년 하반기 소방교육 자 유 전 공 학 부 (금) 안녕하십니까 자유전공학부 행정실 입니다.
컴퓨터 프로그래밍 기초 [Final] 기말고사
10장 함수.
해킹기법 시연과 대응전략 (XSS Backdoor)
CHAPTER 02 OpenCV 개요 PART 01 영상 처리 개요 및 OpenCV 소개.
TETRIS FOR QTOPIA.
12 ███████████ 12.
컴퓨터 프로그래밍 기초 #02 : printf(), scanf()
Javascript Basic Sample Programs
이름:강연주 학번: 담당교수님:박주형교수님
스크래치 언어 이해 스크래치 이용법 습득 고양이가 말을 하며 움직이는 예제 작성
10강. JSP 본격적으로 살펴보기-II 스크립트릿, 선언, 표현식 지시자 주석 Lecturer Kim Myoung-Ho
Method & library.
자바응용.
인터넷응용프로그래밍 JavaScript(Intro).
반응형 웹 프로젝트
이름 : 황 상 두 전화번호 : 이메일 : PinTool 이름 : 황 상 두 전화번호 : 이메일 :
HTML CSS 자바스크립트 무작정 따라하기
- CPC 초기화면의 2, 3번을 참조하여 인터넷 옵션을 변경한다. (상세화면은 다음페이지 참조)
NewsLetter ScrapMaster 사용설명서
Prezi 일촌조 (1조).
3장. 변수와 연산자 교안 : 전자정보통신 홈페이지 / 커뮤니티/ 학술세미나
Chapter6 : JVM과 메모리 6.1 JVM의 구조와 메모리 모델 6.2 프로그램 실행과 메모리 6.3 객체생성과 메모리
폼 관련 태그 폼 양식 직접 만들어보기 회원가입 절차 4단계
개인정보처리와 개인정보보호 2017년 2월.
프로그래밍 원리 Chapter 05 자바스크립트 기초 신한대학교 IT융합공학부 박 호 균.
패시브하우스 신안산대학교 l 건축과 l 박효동, 박창준, 지예림.
웹디자인
스위시 맥스2 이미지 갤러리 만들기 아래 그림이 스위시 맥스2로 만들 이미지 갤러리 이다.
정치개혁의 가능성 논의 권력구조 개편을 통하여 본 -개헌을 통한 정부형태의 변화를 중심으로 [한국정치론] 윤성이 교수님
[ 강남구 청담동 “이동수에프엔지” ].
1. 인증서버 :일반유선PC( 접속“CA관리” 클릭
인천대학교 웹과 인터넷 수업 개요 및 내용 소개.
컴퓨터 계측 및 실습 디지털 출력 영남대학교 기계공학부.
치료 레크레이션 프로그램 (지적 장애 대상) 과 목: 학 과: 학 번: 이 름: 제 출 일 자 담 당 교 수:
오토베이스9 사용자 라이브러리 오토베이스 교육센터 그래픽 모듈 설정과 화면전환에 대하여 자세히 알아본다. <목차>
노년기 발달 장안대 행정법률과 세류반 정 오 손
5 함수.
암호학 응용 Applied cryptography
Chapter08 JavaScript 시작하기
암호학 응용 Applied cryptography
Chapter08 JavaScript 시작하기
태국 문학 욜라다 왓짜니 싸란차나 팟차라와라이 끼따야펀 르앙다우 타니다.
Kyungpook National University
2018년 11월 12일 박성진 Web & Internet [09] 레이아웃 P2 2018년 11월 12일 박성진
9 브라우저 객체 모델.
슬라이드 쇼의 설정 슬라이드 쇼의 실행 파일과 폴더의 관리 글꼴을 포함해서 저장 웹 페이지로 게시 압축 파일
워밍업 실뭉치 전달게임.
웹과 모바일 홈페이지의 이해와 제작 웹기획 & 제작
김선균 컴퓨터 프로그래밍 기초 - 12th : 문자열 - 김선균
음파성명학 최종욱.
피티라인 파워포인트 템플릿.
Docker Study 6~7.
7 생성자 함수.
6 객체.
Presentation transcript:

트위치 트게더 Twitogether 91812191 김준희

제작목적 트위치의 커뮤니티 사이트인 트게더 서로 분리되어 있기 때문에 유동적으로 방송을 즐길수가 없음

템플릿 설명 아이프레임 url에 http://player.twitch.tv/?channel= 를 삽입하여 변수 호출시 해당 방송에서 플레이어 부분만 나오게 하였습니다 트게더를 iframe안에 넣으려니 xframe options때문에 불가능함 디시인사이드 인터넷방송갤러리로 대체하였습니다

스크립트 설명 js 부분에 $.이걸로 시작하는게 jquery라는 자바스크립트 라이브러리 이다 var twitchSearchValue 는 키워드를 저장하는 변수 자료형 string 입니다 twitch라는 ID를 사용하는 태그의 src속성값으로 http://player.twitch.tv/?channel=(사용자가 입력한 스트리머 ID)를 twitchSerchValue와 조합해서 사용하였습니다

스크립트 설명 ---- HTML ---- <input type="search" id="twitch-search-bar" placeholder="스트리머 ID 검색"> <!-- 사용자가 검색할 키워드 입력 --> <button class="search-submit" onclick="twitchSearchFunction()">트위치 검색</button> <!-- 클릭시 twitchSearchFunction() 함수 호출 --> <iframe id="twitch" src(unknown) frameborder="0" allowfullscreen="true"></iframe> ---- JS ---- var twitchSearchValue; // 키워드를 저장할 변수 자료형 String function twitchSearchFunction() { twitchSearchValue = $("#twitch-search-bar").val(); // 전역으로 선언한 TwitchSearchValue 변수에 사용자가 twitch-search-bar에 입력한 value 를 대입 $("#twitch").attr("src", "http://player.twitch.tv/?channel=" + twitchSearchValue); // twitch라는 ID를 사용하는 태그의 src속성값으로 http://player.twitch.tv/?channel=(사용자가 입력한 스트리머 ID)를 입력 }

Thank You