|
HTML
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
|
Görsellere Büyüteç İle Bakma HTML & CSS Kodu:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<div class="buyutec">
<div class="mercek"></div>
<img class="kucuk" src="http://www.tuncvizyon.com/FileUpload/ep727585/Resim/muslum_gurses2.jpg " width="200"/>
</div>
<html>
<head>
<body>
<style type="text/css">
.buyutec {
width: 200px;
margin: 50px auto;
position: relative;
cursor: none}
.mercek {
width: 175px;
height: 175px;
position: absolute;
border-radius: 100%;
box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.85),
0 0 7px 7px rgba(0, 0, 0, 0.25),
inset 0 0 40px 2px rgba(0, 0, 0, 0.25);
display: none;
}
.kucuk { display: block;}
</style> </body></head>
</html>
<script>
$(document).ready(function(){
var gercek_uzunluk = 0;
var gercek_genislik = 0;
$(".mercek").css("background","url('" + $(".kucuk").attr("src") + "') no-repeat");
$(".buyutec").mousemove(function(e){
if(!gercek_uzunluk && !gercek_genislik)
{
var image_object = new Image();
image_object.src = $(".kucuk").attr("src");
gercek_uzunluk = image_object.width;
gercek_genislik = image_object.height;
}else{
var buyutec_offset = $(this).offset();
var mx = e.pageX - buyutec_offset.left;
var my = e.pageY - buyutec_offset.top;
if(mx < $(this).width() && my < $(this).height() && mx > 0 && my > 0)
{$(".mercek").fadeIn(100);}
else{$(".mercek").fadeOut(100);}
if($(".mercek").is(":visible"))
{
var rx = Math.round(mx/$(".kucuk").width()*gercek_uzunluk - $(".mercek").width()/2)*-1;
var ry = Math.round(my/$(".kucuk").height()*gercek_genislik - $(".mercek").height()/2)*-1;
var bgp = rx + "px " + ry + "px";
var px = mx - $(".mercek").width()/2;
var py = my - $(".mercek").height()/2;
$(".mercek").css({left: px, top: py, backgroundPosition: bgp});
}
}
})
})
</script>
|
Görsellere Büyüteç İle Bakma HTML & CSS Kodu:
NOT:
KIRMIZI Renkli bölümü siz kendi Resminizin URL adresini koyunuz
...................................................................................................................................................................................................................
|
|
HTML
|
1
2
3
4
5
6
7
8
9
|
<script language="javascript" type="text/javascript">// <![CDATA[
function new_window3(url){link=window.open(url,"link","width=612,height=370,left=150,top=50");}
// ]]></script>
<a href="javascript:new_window3(' http://original.livestream.com/embed/tuncvizyon?showMoreVideos=false&hideInfo=true&
amp;autoPlay=true&lschannel=true&browseMode=false&textLines=2&hideChannelBranding=true&mode=false&
amp;allowchat=false&layout=4&t=794062 ')" _fcksavedurl="javascript:new_window3(' http://original.livestream.com/embed/tuncvizyon?showMoreVideos=false&
amp;hideInfo=true&autoPlay=true&lschannel=true&browseMode=false&textLines=2&hideChannelBranding=true&mode=false&
allowchat=false&layout=4&t=794062 ')"> <b color:="" red="">TIKLA! <b color:="" black="">Click! <b style="color: blue;"> TV mi
<b style="color: blue;">Popup <b style="color: blue;">İzle</b></a>
|
"Çok güzel Pop Up gösterme Uygulaması:
NOT: new_window3(' Buralara kendi Kodunuzu, uygulamanızı yerleştirin ')"
KIRMIZI Renkli olan yere. DİKKAT! Her yerdeki uygulama kodu da aynısı olmalıdır.
...........................................................................................................................................................................................................
Bir Nesneyi Gisleme & Gösterme MHTML Kodu:
|
|
HTML
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<script language="JavaScript" type="text/javascript">// <![CDATA[
function hide(id){
var divObject=document.getElementById(id);
divObject.style.display="none";
}
function show(id){
var divObject=document.getElementById(id);
divObject.style.display="block";
}
// ]]></script>
<a href="javascript:hide('test')"><b style="color: rgb(224, 0, 0);">[ Gizle ] </b></a>
<a href="javascript:show('test')"><b style="color: green;"> [ Göster ]</b></a>
<div id="test" none="">
Bu alana, araya gizlenip gösterilecek kod veya uygulama konacak. Bunu bu yazı ile de deneyebilirsiniz.
(Yani Gizlenecek bölüm, Kdun altında olacaktır )
<iframe id="livestreamChannelPlayer" name="[B]" width="612" height="370" style="border: 0; outline: 0; background-color: #fffff;"
src="http://original.livestream.com/embed/tuncvizyon?showMoreVideos=false&hideInfo=true&autoPlay=true&lschannel=true&
browseMode=false&textLines=2&hideChannelBranding=true&mode=false&allowchat=false&layout=4&t=794062"
frameborder="0" scrolling="no"></iframe> ( Bu Uygulama gibi )
|
Yukarıdaki kod, Bir nesne veya uygulamayı, gizleyip gösterme kodudur.
.............................................................................................................................................................................................................
Site Çeviri "Translate" HTML Kodu
<!-- Begin TranslateThis Button --><div id="translate-this">
<a href="
http://translateth.is/" class="translate-this-button">Translate</a></div>
<script type="text/javascript" src="
http://www.google.com/jsapi"></script>
<script type="text/javascript" src="
http://x.translateth.is/translate-this.js"></script>
<script type="text/javascript">// <![CDATA[
TranslateThis();
// ]]></script><!-- End TranslateThis Button -->
Yukarıdaki Kod, Goole'ninkinden daha güzel, Sayfanın tümünü 36 dile çevirme "Translate" uygulaması ( Mouse ile üzerine gidince dil tercihleri görünür )
...................................................................................................................................................................................................................
|
|
HTML
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
<center>
<table style="width: 504px; border-collapse: collapse; height: 458px;" id="AutoNumber1" align="center" border="5"
bordercolor="#111111" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="#cccccc" height="54" width="504">
<div style="filter: progid:DXImageTransform.Microsoft.Gradient(endColorstr='#485d8e',
startColorstr='#e4eeee', gradientType='0'); width: 504px; height: 54px; text-align: right; border: #636770 2px solid;">
<div align="left">
<center>
<table style="width: 504px; height: 50px;" cellpadding="0" cellspacing="0"><tr><td height="50" valign="center" width="504">
<center><span style="color: #ff0000; font-size: xx-large;" size="6" color="#ff0000">KODUNU TEST ET</span></center></td></tr></tbody></table></center>
</div></td></tr><tr><td bgcolor="#cccccc" height="397" width="494"><table style="width: 490px; height: 383px;" cellpadding="0" cellspacing="0">
<!-- MSTableType="layout" --><tbody>
<tr>
<td height="306" valign="center">
<p align="center"> </p>
<center>
<script language="JavaScript" type="text/javascript">// <![CDATA[
function preview() { temp = document.tester.box.value; preWindow = open("", "preWindow"," menubar=yes, scrollbars=yes");
preWindow.document.open(); preWindow.document.write(temp); preWindow.document.close(); };
// ]]></script>
<center><table bgcolor="#000000" border="1" bordercolor="#000000" cellpadding="5" cellspacing="0">
<tbody><tr><td align="center" bgcolor="#999999" valign="top"><form name="tester">
<textarea rows="14" cols="55" name="box"></textarea><p>
<input onclick="preview()" value="KODU TEST ET" type="button" />;
<input value="TEMİZLE" type="reset" /></p></form></td></tr></tbody></table></center></center></td>
</tr><tr>
<td height="57" valign="center">
<p align="center"><strong><span style="color: #ff0000;" color="#ff0000">KODUNUZU YAPIŞTIRIP TEST ET BUTONUNA BASARAK KODUNUZUN
<br />GÖRÜNÜMÜNÜ VE ÇALIŞIP ÇALIŞMADIĞINI GÖREBİLİRSİNİZ</span></strong></p></td></tr></tbody></table>
<center></center></td></tr></tbody></table><div><script type="text/javascript">// <![CDATA[
function mouseMoving(e){
if( window.event){
actual_x = document.body.scrollLeft+window.event.clientX;
actual_y = document.body.scrollTop+window.event.clientY;
}else{
actual_x = e.pageX;
actual_y = e.pageY;
}
actual_x = Math.abs((Math.round(actual_x/4)%6)-122)*2;
actual_y = Math.abs((Math.round(actual_y/4)%6)-122)*2;
green = Math.round(((255-actual_x) + (255-actual_y))/2);
body_elm = document.getElementsByTagName('body')[0].style;
body_elm.backgroundColor="rgb("+actual_y+","+green+","+actual_x+")";
}
document.onmousemove = mouseMoving;
// ]]></script>
|
HTML Kodu Test Etme "Kontrol" kodu:
.............................................................................................................................................................................................................[html
[html<iframe width="420" height="350" marginheight="0" src="http://www.onlyfree.de/generator/color_editor.html" frameborder="0" marginwidth="0"></iframe></div>
][/html][html
Renk Editörü "programı"
..............................................................................................................................................................................................................
Sitelere "Online" Satranç Oyunu HTML Kodu
<center><div style="width: 650px;">
<iframe width="650" height="575" align="middle" src="http://www.chesshotel.com/chess.html" scrolling="no" frameborder="no"></iframe>
<center><span style="padding: 0 4px 4px 4px; background: #999999; font-family: verdana,arial; font-size: 12px; float: center;">
<b style="color: white;">"CLOSE"den kapatıp,
<b style="color: black;">Type a username'e
<b style="color: yellow;">Bir Nick Yazarak
<b style="color: blue;"> Oyuna Giriniz</b></b></b></b></span></center></div></center>][/html]
Yukarıdaki HTML Kodu, Çok güzel Online Satranç oyunu uygulamasıdır.
...................................................................................................................................................................................................................
|
|
HTML
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
|
<!-- corrects IE6 width calculation --><div class="columns-inner"><div class="columns-inner"><div class="columns-inner"><div class="column-center-outer"><div class="column-center-inner"><div class="main section"><div class="widget Blog"><div class="blog-posts hfeed"><!-- google_ad_section_start(name=default) --><div class="post-header"><div class="post-header-line-1"></div></div><div class="post-body entry-content"><br /> <a name="more"></a><br /> <!--Kod Dostu Perde İntrosu Kodu START--> <!--Bu çalışma Creative Commons Attribution-Gayriticari-NoDerivs 3.0 Unported Lisansı ile lisanslanmıştır--> <!--Telif sahibi: koddostu.com--><div class="kod-dostu-od od-25-ds" id="koddostu-2block"></div><div class="kod-dostu-od od-24-ds" id="koddostu-1block"></div><a class="kod-dostu-od od-26-ds" id="koddostu-3block" onfocus="this.blur();" href="javascript:void(0)"></a></div></div></div></div></div></div></div></div></div><style type="text/css"><!--
a.kod-dostu-od{position:fixed;z-index:999900;}div.kod-dostu-od{position:fixed;z-index:999900;}div.od-24-ds{top:0px;left:0px;width:50%;height:100%;background:#961e1d
url(http://3.bp.blogspot.com/-wngxLxO4ZsA/USedcyyF0EI/AAAAAAAASg0/wPdGFXG-TPE/s1600/koddostupowered.jpg) no-repeat top left;background-size:120% 100%;}
div.od-25-ds{top:0px;right:0px;width:50%;padding-left:35px;height:100%;background:#961e1d url(http://3.bp.blogspot.com/-wngxLxO4ZsA/USedcyyF0EI/AAAAAAAASg0/wPdGFXG-TPE/s1600/koddostupowered.jpg)
no-repeat top right;background-size:120% 100%;}a.od-26-ds{right:15px;top:-75px;width:118px;height:320px;background:transparent
url(http://3.bp.blogspot.com/-mRw0L-hknVM/USefTv3HgrI/AAAAAAAAShE/YRd_iHDElhM/s1600/rope.png) no-repeat top left;}
--></style><style type="text/css"><!--
div.kod-dostu-od{_position:absolute;}a.kod-dostu-od{_position:absolute;}div.od-24-ds{_bottom:auto;_top:expression(ie6=(document.documentElement.scrollTop+document.documentElement.clientHeight - 52+"px") );}div.od-25-ds{_bottom:auto;_top:expression(ie6=(document.documentElement.scrollTop+document.documentElement.clientHeight - 52+"px") );}a.od-26-ds{_bottom:auto;_top:expression(ie6=(document.documentElement.scrollTop+document.documentElement.clientHeight - 52+"px") );}
--></style><div class="columns-inner"><div class="columns-inner"><div class="columns-inner"><div class="column-center-outer"><div class="column-center-inner"><div class="main section"><div class="widget Blog"><div class="blog-posts hfeed"><div class="columns-inner"><div class="column-center-outer"><div class="column-center-inner"><div class="main section"><div class="widget Blog"><div class="blog-posts hfeed"><div class="post-body entry-content"><script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script><script type="text/javascript">// <![CDATA[
var tdt=0;
$("#koddostu-3block").click(function(){
var tdta=tdta+1
if(tdta==5){
window.open('http://www.koddostu.com','')
}
if($("#koddostu-1block").offset().left ==0){
$("#koddostu-3block").animate({
top: "0px"
}, 800, function(){
$("#koddostu-3block").animate({
top: "-15px"
}, 300)
});
$("#koddostu-1block").animate({
width: "200px",
left: "-125px",
}, 1100);
$("#koddostu-2block").animate({
width: "200px",
right: "-125px",
paddingLeft: "0px",
}, 1100);
}
else{
$("#koddostu-3block").animate({
top: "0px"
}, 300, function(){
$("#koddostu-3block").animate({
top: "-75px"
}, 800)
});
$("#koddostu-1block").animate({
width: "50%",
left: "0px"
}, 1100);
$("#koddostu-2block").animate({
width: "50%",
right: "0px",
paddingLeft: "35px"
}, 1100);
}
});
// ]]></script><meta http-equiv="Page-Enter" content="revealTrans(duration=2, Transition=23)" />
<meta http-equiv="Page-Exit" content="revealTrans(duration=2, Transition=24)" /><br /><br />
<center></center></div></div></div></div></div></div></div></div></div></div></div></div></div></div></div><style type="text/css"><!--
A{text-decoration:none}
--></style>
<div class="columns-inner">
<div class="columns-inner">
<div class="columns-inner">
<div class="column-center-outer">
<div class="column-center-inner">
<div class="main section">
<div class="widget Blog">
<div class="blog-posts hfeed">
<div class="columns-inner">
<div class="column-center-outer">
<div class="column-center-inner">
<div class="main section">
<div class="widget Blog">
<div class="blog-posts hfeed">
<div class="post-body entry-content">
<center><center><h1>
<b style="color:blue">Buradan yukarısını Sayfanızın kod kısmının en başına koyunuz.</b>
|
Yukarıdaki HTML Kodu. Siteye veya sayfaya, "perdeli açılış"lı girişi sağlar.
..................................................................................................................................................................................................................
|
|
HTML
|
1
2
3
4
|
<b style="color: blue;">FLUG; OLAN RESME NETLIK VEREN UYGULAMA</b><br />
<p align="center">
<img alt="" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.5;this.filters.alpha.opacity=50"
style="filter: alpha(opacity=50); opacity: 0.5;" src="http://www.tuncvizyon.com/FileUpload/ep727585/Resim/safiye_bulut.jpg" /></p>
|
Yukarıdaki HTML Kodu, Resme netlik ve fluğluk verir. "Değerleri değiştirerek, fluğluk oranını isteğinize göre değiştirebilirsiniz."
NOT:
KIRMIZI Renkli alana, siz kendi resminizin URL Adresini koyunuz.
.......................................................................................................................................................................................................
|
|
Kaynak kod
|
1
|
http://www.tuncvizyon.com/?pnum=122&pt=Splitcam-5-4-6-0-en-win+"Download"+Ä°ndir
|
Yukarıdaki Linkte ise, Flatcast'in Video uygulamasında, FlatCast temanızda, kendi görüntünüzü, masa üstünüzü veya Video klip yayınlayabilirsiniz.
NOT: İndirdikten sonra, programı kurmadan önce, internet seçeneklerinden girip;
"GUVENLİK ve GİZLİLİK" ayarlarını en üst seviyeye çıkartınız. Yoksa kurulum esnasında reklam uygulaması ve başka uygulamaları da kurabilir.
"Arzu edene, SplitCam programının Flatcast'a entegresi için yardımcı olmaya çalışırım"
...............................................................................................................................................................................................................
|
|
HTML
|
1
2
|
<img border="0" src="https://lh5.googleusercontent.com/-DnlAhSr6hgw/TX8dWqePQPI/AAAAAAAABvc/7B1qI27SZwk/s1600/51203193.gif" height="128" width="128"
onmouseover="this.height='256';this.width='400';" onmouseout="this.height='128';this.width='200';" />
|
Yukarıdaki HTML kodu, Mouse ile üzerine gidince resmi büyültür.
NOT:
KIRMIZI Renkli alana, siz kendi resminizin URL Adresini koyunuz.
.................................................................................................................................................................................................................
|
|
HTML
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
<!--- KAYNAK www.kodbul.org ---> <script type="text/javascript">// <![CDATA[
var rollOverArr=new Array();
function setrollover(OverImgSrc,pageImageName)
{
if (! document.images)return;
if (pageImageName == null)
pageImageName = document.images[document.images.length-1].name;
rollOverArr[pageImageName]=new Object;
rollOverArr[pageImageName].overImg = new Image;
rollOverArr[pageImageName].overImg.src=OverImgSrc;
}
function rollover(pageImageName)
{
if (! document.images)return;
if (! rollOverArr[pageImageName])return;
if (! rollOverArr[pageImageName].outImg)
{
rollOverArr[pageImageName].outImg = new Image;
rollOverArr[pageImageName].outImg.src = document.images[pageImageName].src;
}
document.images[pageImageName].src=rollOverArr[pageImageName].overImg.src;
}
function rollout(pageImageName)
{
if (! document.images)return;
if (! rollOverArr[pageImageName])return;
document.images[pageImageName].src=rollOverArr[pageImageName].outImg.src;
}
// ]]></script> <a onmouseout="rollout('home')" onmouseover="rollover('home')" href="http://www.tuncvizyon.com/?SyfNmb=1&pt=Anasayfa">
<img border="0" title="TIKLAYIN! Sitemin Girişidir" alt="" name="home" src="http://www.tuncvizyon.com/FileUpload/ep727585/Resim/safiye_bulut.jpg "/></a>
<script type="text/javascript">// <![CDATA[
setrollover("http://www.tuncvizyon.com/FileUpload/ep727585/Resim/muslum_gurses2.jpg");
// ]]></script>
<!--- KAYNAK www.kodbul.org --->
|
Yukarıdaki HTML Kodu, Mouse ile üzerine gidince resmi değiştirir.
NOT:
href="http://www.tuncvizyon.com/?SyfNmb=1&pt=Anasayfa"> olan yere resimlere tıklanınca yönlendirilecek link adresi konacak.
KIRMIZI renkli olan yere ilk açılıştaki Resim URL adresi konacak.
http://www.tuncvizyon.com/FileUpload/ep727585/Resim/muslum_gurses2.jpg Resim URL adresli olan yere ise. Mouse ile üzerine gidince değişecek Resim URL Adresi konacak.
...............................................................................................................................................................................................................
|
|
HTML
|
1
|
<center><iframe width="910" height="411" src="http://www.canlitvlive.co/tvizle.php?t=2" frameborder="0"></iframe></center>
|
Yukarıdaki HTML Kodu, Tüm Ulusal Kanalları izlemek içindir.
...............................................................................................................................................................................................................
Index Html Yardım »
Bazı indexlerin HTML kodlarını bulamıyorum
(21.02.2013, 15:21)
