ARAMA YAPIN

20 Aralık 2015 Pazar

javascript ve style komut örnekleri

CSS JS ARAMA
  • style="cursor:url('resim/zoomin.cur'), default;"
  • display:block;
  • display:none;
  • cursor:url('resim/tasi.cur'), default;
  • height:31px;
  • width:69px;
  • text-decoration:none;
  • text-shadow:0 1px 0 rgba(255,255,255,.5);
  • border-bottom:1px solid #aaa;
  • border-radius:2px 2px 0 0;
  • a:hover, a:focus {opacity:.9;}
  • padding:10px 15px;
  • background:black;
  • color:yellow;
  • border-radius:5px;
  • -webkit-box-shadow:0 1px 3px rgba(0,0,0,.3);
  • -moz-box-shadow:0 1px 3px rgba(0,0,0,.3);
  • -o-box-shadow:0 1px 3px rgba(0,0,0,.3);
  • box-shadow:0 1px 3px rgba(0,0,0,.3);
  • overflow:hidden;
  • -webkit-transition:height .4s ease-out, padding .4s ease-out;
  • -moz-transition:height .4s ease-out, padding .4s ease-out;
  • -o-transition:height .4s ease-out, padding .4s ease-out;
  • -ms-transition:height .4s ease-out, padding .4s ease-out;
  • transition:height .4s ease-out, padding .4s ease-out;
  • padding:5em;
  • padding-bottom:0;
  • margin:10em;
  • margin-left: 10px;
  • margin-top: 10px;
  • margin-right: 10px;
  • margin-bottom: 10px;
  • font:.8em/1.7 "Lucida Sans";
  • font-weight:700;
  • list-style:none;
  • top:50%;
  • left:50%;
  • opacity:1;
  • -webkit-transform:scale(1.03)
  • -moz-transform:scale(1.03)
  • font-size: 10px; /* harf boyutu
  • position:absolute;
  • position:fixed;
  • a:link{color:Blue;} /* link rengi */
  • a:hover{color:Red;} /* Fare üzerine geldiğinde aktif olur */
  • a:active{color:Green;} /* yazıyı aktifte iken renklendirir */
  • a{text-decoration:none;} /* Yazı altındaki çizgiyi kaldırır */
  • z-index:9999; /* üstte olmak */
  • opacity: 5.2;
  • filter: alpha(opacity=300);/* For IE 8 & 9 (more valid) */
  • background-color:#FFE4C9;
  • margin:-170px 0 0 400px;
  • -webkit-transition: 1.8s;
  • -moz-transition: 1.8s;
  • border-width: 5px;
  • border-style: solid;
  • position: relative; /* pozisyon konumu */
  • left: 50px; /* sola doğru 50px */
  • H1{background-color:blue;} /* Arka alan rengi */
  • text-indent:250px; /* yazıyı kaydırma */
  • a.tooltip {outline:none; } /* hat çıkışı kapalı */
  • a.tooltip strong {line-height:30px;}
  • a.tooltip span
  • line-height:16px; /* hat yüksekliği */
  • H2{text-align:center;}
  • -webkit-transition: all 0.75s ease;
  • display: inline-block;
  • -webkit-tap-highlight-color: transparent;
  • padding: 1.2em .8em;
  • section {max-width: 450px; margin: 0 auto; padding: 3em 0;}
  • section + section {border-top: 1px solid #ddd;} /* alan kenarlık */
  • img {vertical-align:middle;} /* resim dikey orta */
  • list-style:none; /* Listeleme kapalı */
  • -webkit-transition:opacity .2s linear; /* düşük hız saydam */
  • @-webkit-keyframes supersize {0% { -webkit-transform:scale(.9); }100% { -webkit-transform:scale(1); }}
  • overflow:hidden; /* Alan dışına taşmadı */
  • -webkit-transition:opacity 1.2s cubic-bezier(0,0,0,1);
  • li[id] a:before {content:url(close.gif);
  • li[id] a:hover:before {opacity:1; content:url(zoomout.cur);}
  • li[id]:target {width:100%; height:100%; opacity:1;} /* kaynak genişlik yükseklik saydam */
  • div#myDiv {-ms-transform: rotate(20deg);} /* IE 9 */
  • div#myDiv {-webkit-transform: rotate(20deg);} /* Safari açılı döndürme */
  • div#myDiv {transform: rotate(40deg);} /* Standard syntax */
  • #toool, img{width:50px;} /* img resim boyutu */
  • div img{width:150px;} /* img resim boyutu */
  • input:hover, select:hover {background:yellow;} /* iki object çalışır */
  • onMouseDown="document.bgColor='yellow'
  • oninput="resimci()" yazarken hemen günceller
  • input type="text" id="resimci" placeholder="Resim dosyası adı yazın" oninput="resimci()"
  • input:focus {background-color: yellow;}
  • border-image-slice: 30;
  • background-color: linen;
  • text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF;
  • text-shadow: 20px 20px #FF0000;
  • document.getElementById("myDIV").classList.remove("mystyle");
  • document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass");
  • document.getElementById("myDIV").classList.add("mystyle");// css ve js ortak köprü //
  • onmouseover="myFunction()" onmouseout="myFunction2()"
  • document.body.style.backgroundSize = "1200px"; // arka plan boyut //
  • document.body.style.backgroundRepeat = "no-repeat"; // arka plan tek resim//
  • document.body.style.backgroundImage = "url('resim/sinasi.jpg')"; // JS//
  • (-webkit-filter:grayscale(" + value*1 + "%)") // siyah beyaz //
  • ("style","-webkit-filter:grayscale(" + value*1 + "%)")
  • filter:sepia(100%);
  • filter:saturate(8);
  • filter:opacity(30%); // saydam yapma //
  • filter:invert(100%); // negatif resim //
  • filter:hue-rotate(90deg); // dereceli resim //
  • filter:drop-shadow(8px 8px 10px red);// gölgeli //
  • filter:blur(5px); // bulanık resim //
  • filter:brightness(200%) // parlaklık verme //
  • filter:contrast(200%); // kontrast resim //
  • background-repeat: no-repeat;
  • background-attachment: fixed; // ekleme //
  • text-transform: capitalize; // Baş Harf büyük CSS //
  • text-transform: lowercase;// küçük harf CSS //
  • text-transform: uppercase; // büyük harf CSS //
  • -webkit-animation-delay: 2s; // ağır //
  • window.open("http://www.elektrosin.com/", "", "width=300, height=300"); // popup pencerede link açar JS //
  • document.body.style.backgroundColor = "yellow"; // JS//
  • document.body.innerHTML = "makale yaz " // script içine yazı yazılabilir JS//
  • body.style.backgroundColor = "blue" // Arka plan renk kısa kod JS//
  • document.getElementsByTagName('textarea')[0].style.backgroundColor = '#'+this.color
  • document.getElementsByTagName("H1")[0].setAttribute("class", "class1"); // css ile script ortak //
  • document.getElementsByTagName('img')[0].style.width = 20*x + "px"; // TagName ile resim boyutu JS//
  • document.getElementById("rota_resim").style.width = 20*x + "px"; // Etiket ile resim boyutu JS//
  • var x = document.getElementById("myRange5").value;
  • document.getElementById("resim_adeti").innerHTML = "Number of images: " + document.images.length;
  • document.getElementById('myBtn').style.cursor = 'url("resim/zoomin.cur"), auto';
  • document.getElementById("gun").innerHTML = "Today is " + day;
  • var x = document.getElementById("resimMy").value;
  • document.getElementById("myResim").src = "resim/"+ x +".jpg";
  • document.title='Şinasi Yavuz';
  • onclick="document.getElementById('titleResim').href = 'resim/sexy7ab.png' ;"
  • document.getElementById("cumlem").innerHTML ="Selam Aleyküm";
  • document.getElementById("lokal").innerHTML = "Sayfamın konumu: " + window.location.href;
  • document.getElementById("harf_adeti").innerHTML = "Harf Adeti: " + txt.length;
  • location.href = "http://www.elektrosin.com";
  • var str = "Şinasi Yavuz"; var res = str.toUpperCase(); document.getElementById("harfci").innerHTML = res;
  • var str = mini_yazi.value; var res = str.toUpperCase(); document.getElementById("harfci").innerHTML = res;
  • document.getElementById("ko0").setAttribute("class", "class1");
  • document.getElementById("divID").setAttribute("style","-webkit-filter:grayscale(" + value + "%)")
  • document.addEventListener("click", function(){document.body.style.backgroundColor = "red";});
  • document.querySelector(".example").style.backgroundColor = "red";
  • document.querySelector("p").style.backgroundColor = "red";
  • document.getElementById("myP").style.visibility = "hidden";
  • document.getElementById("myImg").style.visibility = "visible";
  • document.getElementById("myP1").style.display = "none";
  • e.style.fontSize = '55px';
  • if(e.style.color == 'blue')
  • e.style.color = 'yellow';
  • var e = document.getElementById(id);
  • ("style","-webkit-transform:translateX(" + value*17 + "px)")
  • ("style","-webkit-transform: rotate(" + value*4 + "deg)")
  • document.getElementById("divID").setAttribute("style","-webkit-transform: rotate(" + value*4 + "deg)")
  • function changegrayscale(value)
  • ("style","-webkit-transform:translateY(" + value*17 + "px)")
  • transform:scale(0.5,2);
  • background-position:center center;
  • Arka FON Resimli | background-image:url('uzay_fon.gif');
  • background-repeat:no-repeat;
  • background-position:50% 50%;
  • font-variant: small-caps;
  • align-self: center;
  • location.reload();
  • onload="brightness('25'); invert('0'); bulur('0'); kontrast('50'); gri('0'); cevir(0);
  • placeholder="buradan arayın"
  • input type="text" name="usrname" maxlength="10" Harf kısıtlaması en fazla HTML
  • input onchange="myFont()" type="range" id="myRange_yazi" value="" min="10" max="30" step="3"
  • Yazıyı Tıkla!

  • onclick="this.style.backgroundColor='green'"
  • link id="iconYaz" rel="icon" href="resim/girl.png" type="image/png"
  • background-position:50% 50%; resim konum CSS
  • document.body.style.backgroundPosition="top right";
  • document.getElementById('yaz').setAttribute("style","color:blue");
  • input type=range thumb value
  • text-align:center;
  • clear:both;
  • var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
  • if (new Date().getHours() < 18) {----}
  • document.getElementById("harf_adeti").innerHTML = txt.length + " Adet Karakter";
  • textarea cols="90px" rows="20px"
  • onclick="document.getElementById('seri').innerHTML = s ; "
  • onclick="setTimeout(seriFunc, 3000);"
  • var x = document.getElementsByTagName("p");
  • document.getElementById("myForm").target = "_blank";
  • textarea#test {resize: none;}
  • onmousedown="classList.add('mystyle');"
  • location.pathname
  • auto crosshair default e-resize grab help move n-resize ne-resize nw-resize pointer progress s-resize se-resize sw-resize text w-resize wait not-allowed no-drop
  • document.getElementById("myDiv").style.border = "thick solid #0000FF";
  • background-image :url('resim/note3.png');
  • background-size :20px;
  • background-repeat: no-repeat;
  • document.body.style.backgroundImage = "url('resim/simit_fon.gif')";
  • document.body.style.backgroundRepeat = "no-repeat";
  • document.body.style.backgroundSize = "1300px 900px";
  • x = document.getElementById("sesVar").value ;
  • document.getElementById("sesCal").src = "ses/" + x + ".wav";
  • document.getElementById('sesCal').play();
  • link id="iconYaz" rel="icon" href="resim/note3.png" type="image/png"
  • script type="text/javascript" src="js/beep.js" language="javascript"
  • audio id="sesCal" src="ses/beep04.wav" preload="auto"
  • input:focus
  • background-image :url('resim/note3.png'); background-size :20px; background-repeat: no-repeat;
  • input id="arkaFon" type="color" dat="fonRengi" name="favcolor" value="#ff0000" oninput="renkFunc()"
  • transition-property: background;
  • transition-timing-function: linear;
  • transition-duration: 1s;
  • font-weight :bold;
  • x = x - 1; if(x < 0){x = 0;}
  • font-style: oblique;
  • font-style: italic;
  • height: 20px; background: -webkit-linear-gradient(green,yellow,blue);
  • height: 20px; background: -webkit-linear-gradient(left, red , blue);
  • var str = "şinasi yavuz"; document.getElementById("demo").innerHTML = str.slice(6,12);
  • str.slice(5);
  • str.substr(7,6);
  • var x = 1; Boolean(x == 1); sonuç: true
  • var x = 0; Boolean(x = 0); sonuç: false

Hiç yorum yok:

Yorum Gönder

Yorum yazın