미리보기 : http://121.156.58.206/inc/jin/jin/youtube.php
아티스트를 클릭하세요
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="description" content="youtube search api">
<meta name="keywords" content="jquery & youtube api">
<meta name="author" content="dokjin@gamil.com">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<title>Youtube Search</title>
<script type="text/javascript">
<!--
function search_youtube(query,image){
var results = 24;//검색결과
$("#result").html('');
var keyword= encodeURIComponent(query);
var yt_url='http://gdata.youtube.com/feeds/api/videos?q='+keyword+'&format=5&max-results='+results+'&v=2&alt=jsonc';
$.ajax({
type: "GET",
url: yt_url,
dataType:"jsonp",
success: function(response)
{
if(response.data.items)
{
$.each(response.data.items, function(i,data)
{
var video_id=data.id;
var video_title=data.title;
var video_viewCount=data.viewCount;
var video_image=data.thumbnail.sqDefault;
var video_description=data.description;
if (image)
{
var video_frame="<img src='"+ video_image+"'>";
}else{
var video_frame="<iframe width='193' height='160' src='http://www.youtube.com/embed/"+video_id+"' frameborder='0' ype='text/html'></iframe>";
}
var final='<li style="float:left;padding-right:10px;height:400px;"><a href="#">'+video_frame+'<br /><dl style="margin-top:10px;width:173px;"><dt>'+video_title+'('+video_viewCount+')</dt><dd>'+video_description+'</dd></dl></a></li>';
$("#result").append(final);
});
}
else
{
$("#result").html("<div id='no'>No Video</div>");
}
}
});
}
//-->
</script>
<style type="text/css">
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin:0;
padding:0;
border:0;
line-height:normal;
}
body {font-size:.75em; font-family:"굴림",gulim, "돋움", Dotum, Helvetica, Verdana, Arial, sans-serif;}
a:link {color:#666; text-decoration:none;}
a:visited {color:#666; text-decoration:none;}
a:hover {color:#000; text-decoration:underline;}
a:active {color:#666; text-decoration:none;}
#container{width:980px; margin:0 auto;border:#cccccc 1px solid;}
#main_contents_area{padding:10px;}
.floatL {float:left !important;}
.floatR {float:right !important;border-left:#cccccc 1px solid;}
.artist_list{padding:10px;width:200px;}
.artist_list li{list-style:none;border-bottom:#cccccc 1px solid;padding:5px;}
.video_list{padding:10px;}
/* Live B */
.video_list ul {width:710px; padding-left:2px; overflow:hidden; *zoom:1;}
.video_list ul li {float:left; width:195px; height:213px; margin:5px 9px; overflow:hidden;}
.video_list ul li a {display:block;}
.video_list ul li img {width:193px; height:123px; margin-bottom:3px; border:1px solid #ccc;}
.video_list ul dt {width:193px;font-size:14px; color:#333; font-weight:bold; height:37px; line-height:120%; overflow:hidden;}
.video_list ul dd {width:193px;font-size:12px; line-height:130%; color:#777;}
</style>
</head>
<body>
<br />
<!-- Container -->
<div id="container">
<!-- Contents -->
<div id="main_contents_area" class="floatL">
<ul style="width:720px; padding-left:2px; overflow:hidden; *zoom:1;" id="result"></ul>
</div>
<!-- Aside -->
<div id="main_side_area" class="floatR">
<ul class="artist_list">
<li onclick="search_youtube('바이브')">바이브</li>
<li onclick="search_youtube('김광석')" >김광석</li>
<li onclick="search_youtube('이문세')">이문세</li>
<li onclick="search_youtube('이승철')">이승철</li>
<li onclick="search_youtube('2ne1')">2ne1</li>
<li onclick="search_youtube('박정현')">박정현</li>
<li onclick="search_youtube('장혜진')">장혜진</li>
<li onclick="search_youtube('옛사랑')">옛사랑</li>
</ul>
</div>
</div>
</body>
</html><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>
아티스트를 클릭하세요
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="description" content="youtube search api">
<meta name="keywords" content="jquery & youtube api">
<meta name="author" content="dokjin@gamil.com">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<title>Youtube Search</title>
<script type="text/javascript">
<!--
function search_youtube(query,image){
var results = 24;//검색결과
$("#result").html('');
var keyword= encodeURIComponent(query);
var yt_url='http://gdata.youtube.com/feeds/api/videos?q='+keyword+'&format=5&max-results='+results+'&v=2&alt=jsonc';
$.ajax({
type: "GET",
url: yt_url,
dataType:"jsonp",
success: function(response)
{
if(response.data.items)
{
$.each(response.data.items, function(i,data)
{
var video_id=data.id;
var video_title=data.title;
var video_viewCount=data.viewCount;
var video_image=data.thumbnail.sqDefault;
var video_description=data.description;
if (image)
{
var video_frame="<img src='"+ video_image+"'>";
}else{
var video_frame="<iframe width='193' height='160' src='http://www.youtube.com/embed/"+video_id+"' frameborder='0' ype='text/html'></iframe>";
}
var final='<li style="float:left;padding-right:10px;height:400px;"><a href="#">'+video_frame+'<br /><dl style="margin-top:10px;width:173px;"><dt>'+video_title+'('+video_viewCount+')</dt><dd>'+video_description+'</dd></dl></a></li>';
$("#result").append(final);
});
}
else
{
$("#result").html("<div id='no'>No Video</div>");
}
}
});
}
//-->
</script>
<style type="text/css">
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin:0;
padding:0;
border:0;
line-height:normal;
}
body {font-size:.75em; font-family:"굴림",gulim, "돋움", Dotum, Helvetica, Verdana, Arial, sans-serif;}
a:link {color:#666; text-decoration:none;}
a:visited {color:#666; text-decoration:none;}
a:hover {color:#000; text-decoration:underline;}
a:active {color:#666; text-decoration:none;}
#container{width:980px; margin:0 auto;border:#cccccc 1px solid;}
#main_contents_area{padding:10px;}
.floatL {float:left !important;}
.floatR {float:right !important;border-left:#cccccc 1px solid;}
.artist_list{padding:10px;width:200px;}
.artist_list li{list-style:none;border-bottom:#cccccc 1px solid;padding:5px;}
.video_list{padding:10px;}
/* Live B */
.video_list ul {width:710px; padding-left:2px; overflow:hidden; *zoom:1;}
.video_list ul li {float:left; width:195px; height:213px; margin:5px 9px; overflow:hidden;}
.video_list ul li a {display:block;}
.video_list ul li img {width:193px; height:123px; margin-bottom:3px; border:1px solid #ccc;}
.video_list ul dt {width:193px;font-size:14px; color:#333; font-weight:bold; height:37px; line-height:120%; overflow:hidden;}
.video_list ul dd {width:193px;font-size:12px; line-height:130%; color:#777;}
</style>
</head>
<body>
<br />
<!-- Container -->
<div id="container">
<!-- Contents -->
<div id="main_contents_area" class="floatL">
<ul style="width:720px; padding-left:2px; overflow:hidden; *zoom:1;" id="result"></ul>
</div>
<!-- Aside -->
<div id="main_side_area" class="floatR">
<ul class="artist_list">
<li onclick="search_youtube('바이브')">바이브</li>
<li onclick="search_youtube('김광석')" >김광석</li>
<li onclick="search_youtube('이문세')">이문세</li>
<li onclick="search_youtube('이승철')">이승철</li>
<li onclick="search_youtube('2ne1')">2ne1</li>
<li onclick="search_youtube('박정현')">박정현</li>
<li onclick="search_youtube('장혜진')">장혜진</li>
<li onclick="search_youtube('옛사랑')">옛사랑</li>
</ul>
</div>
</div>
</body>
</html><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]</div>
댓글 3개
14년 전
감사합니다.
14년 전
잘 사용하겠습니다.
14년 전
감사합니다. 참고하겠습니다.
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 3930 | 14년 전 | 1355 | ||
| 3929 |
방황하는중년
|
14년 전 | 525 | |
| 3928 | 14년 전 | 643 | ||
| 3927 | 14년 전 | 693 | ||
| 3926 |
Lemios
|
14년 전 | 715 | |
| 3925 | 14년 전 | 994 | ||
| 3924 |
 TopSchooL |
14년 전 | 1042 | |
| 3923 | 14년 전 | 1614 | ||
| 3922 | 14년 전 | 638 | ||
| 3921 |
피디인사이드
|
14년 전 | 1082 | |
| 3920 |
wgarlic
|
14년 전 | 2870 | |
| 3919 |
또치2009
|
14년 전 | 795 | |
| 3918 | 14년 전 | 748 | ||
| 3917 |
 KoreaCpt |
14년 전 | 1183 | |
| 3916 | 14년 전 | 1174 | ||
| 3915 | 14년 전 | 2021 | ||
| 3914 | 14년 전 | 1234 | ||
| 3913 | 14년 전 | 614 | ||
| 3912 | 14년 전 | 553 | ||
| 3911 | 14년 전 | 465 | ||
| 3910 | 14년 전 | 671 | ||
| 3909 | 14년 전 | 2187 | ||
| 3908 | 14년 전 | 626 | ||
| 3907 | 14년 전 | 646 | ||
| 3906 | 14년 전 | 743 | ||
| 3905 | 14년 전 | 948 | ||
| 3904 |
후라보노보노
|
14년 전 | 590 | |
| 3903 | 14년 전 | 871 | ||
| 3902 | 14년 전 | 1430 | ||
| 3901 |
fstjang
|
14년 전 | 666 | |
| 3900 | 14년 전 | 991 | ||
| 3899 |
 나스디자인 |
14년 전 | 441 | |
| 3898 | 14년 전 | 507 | ||
| 3897 | 14년 전 | 985 | ||
| 3896 | 14년 전 | 1336 | ||
| 3895 | 14년 전 | 1421 | ||
| 3894 | 14년 전 | 889 | ||
| 3893 | 14년 전 | 812 | ||
| 3892 |
 날라리개발자 |
14년 전 | 1338 | |
| 3891 | 14년 전 | 859 | ||
| 3890 | 14년 전 | 3954 | ||
| 3889 | 14년 전 | 1887 | ||
| 3888 | 14년 전 | 683 | ||
| 3887 | 14년 전 | 605 | ||
| 3886 | 14년 전 | 3544 | ||
| 3885 |
후라보노보노
|
14년 전 | 4246 | |
| 3884 | 14년 전 | 984 | ||
| 3883 | 14년 전 | 1165 | ||
| 3882 | 14년 전 | 4403 | ||
| 3881 |
minini
|
14년 전 | 1221 | |
| 3880 | 14년 전 | 1000 | ||
| 3879 | 14년 전 | 748 | ||
| 3878 | 14년 전 | 764 | ||
| 3877 |
내꿈은대통령
|
14년 전 | 955 | |
| 3876 | 14년 전 | 885 | ||
| 3875 | 14년 전 | 1031 | ||
| 3874 | 14년 전 | 911 | ||
| 3873 | 14년 전 | 1331 | ||
| 3872 |
뜨드미지근
|
14년 전 | 679 | |
| 3871 |
SW커뮤니케이션
|
14년 전 | 539 | |
| 3870 |
방황하는중년
|
14년 전 | 562 | |
| 3869 | 14년 전 | 711 | ||
| 3868 | 14년 전 | 1175 | ||
| 3867 |
방황하는중년
|
14년 전 | 816 | |
| 3866 |
웹스커뮤니티
|
14년 전 | 1358 | |
| 3865 | 14년 전 | 1110 | ||
| 3864 |
 Terrorboy |
14년 전 | 1084 | |
| 3863 | 14년 전 | 1053 | ||
| 3862 |
 비주얼브릭스 |
14년 전 | 1920 | |
| 3861 |
비주얼브릭스 |
14년 전 | 3240 | |
| 3860 | 14년 전 | 1448 | ||
| 3859 | 14년 전 | 2388 | ||
| 3858 |
웹스커뮤니티
|
14년 전 | 1893 | |
| 3857 | 14년 전 | 1775 | ||
| 3856 |
크라잉감튀
|
14년 전 | 955 | |
| 3855 |
techer
|
14년 전 | 496 | |
| 3854 |
techer
|
14년 전 | 779 | |
| 3853 |
techer
|
14년 전 | 937 | |
| 3852 |
디자이너몽
|
14년 전 | 1653 | |
| 3851 | 14년 전 | 1710 | ||
| 3850 | 14년 전 | 1138 | ||
| 3849 | 14년 전 | 784 | ||
| 3848 | 14년 전 | 1005 | ||
| 3847 | 14년 전 | 1035 | ||
| 3846 | 14년 전 | 1054 | ||
| 3845 | 14년 전 | 584 | ||
| 3844 |
풍객리무진짱
|
14년 전 | 657 | |
| 3843 | 14년 전 | 774 | ||
| 3842 | 14년 전 | 1720 | ||
| 3841 | 14년 전 | 918 | ||
| 3840 | 14년 전 | 863 | ||
| 3839 | 14년 전 | 1151 | ||
| 3838 |
xkingcode
|
14년 전 | 764 | |
| 3837 | 14년 전 | 914 | ||
| 3836 | 14년 전 | 868 | ||
| 3835 |
temptiger
|
14년 전 | 1151 | |
| 3834 | 14년 전 | 699 | ||
| 3833 | 14년 전 | 706 | ||
| 3832 | 14년 전 | 619 | ||
| 3831 | 14년 전 | 727 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기