Mrb arkadaşlar sizlerden bir ricam olacak. Kısaca anlatayım Mesela sitemde photoshop die bölüm var Tıkladığımızda. Photoshop x1 dersi, Photoshop x12 dersi gibi anlatımlar gelecek fakat ders adına tıklayınca içerik ortaya çıkacak (ayrı linkte değil) sonra tekrar tıklandığında kapancak. Veya konunun altında dersi yada konuyu herneyse ise kapat botonu olacak. dediğimi daha iyi anlayabilmek şu koda bakabilirsiniz. Elimde bu kod var ama istediğim biraz daha farklı ama buna benzer hemen hemen
Kodu inceleyin lütfen
Kod: <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<title>Yeni Sayfa 2</title>
</head>
<body>
<head>
<meta content="Yüze Maske Nasıl Yapılır, Yüz Montajlama, Adobe Dersleri,Photoshop,Fotoşop,Ders,Adobe ,Photoshp,Adobe Photoshp dersleri,ders,video Adobe Photoshp ders,photoshop dersleri,maske uyarlama,yüze montaj,Saç Rengini Değiştirme ,Nasıl Yapılır,-Dersi Göster" name="keywords" />
</head>
<div>
<p align="center"><font face="Verdana"><b><u><font size="4">Photoshop Dersleri Resimli Amlatımlar</font></u><br />
<br />
Not:</b> <b><font color="#ff0000">Dersleri Görmek için Butonlara tıklayınız.</font>İstediğiniz derse (resimli anlatıma baktıktan sonra dersi gizle butonuna tıklarsanız sizler için daha bir kolaylık sağlayacaktır.</b> <font size="1"><br />
</font></font><img height="100" alt="" width="593" border="0" src="http://img350.yukle.tc/images/9913rerererklam.png" /></p>
</div>
<div style="margin: 0px">
<div class="smallfont" style="margin-bottom: 2px"><input type="button" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Dersi Gizle'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Yüze Maske-Montaj Nasıl Yapılır.-Dersi Göster'; }" style="padding-right: 3px; padding-left: 3px; font-weight: bold; font-size: 10pt; padding-bottom: 7px; margin: 8px; width: 512px; padding-top: 7px; font-family: Verdana; height: 44px" value="Yüze Maske-Montaj Nasıl Yapılır. -Dersi Göster" /><br />
</div>
<div class="alt1" style="border-right: 0px inset; padding-right: 0px; border-top: 0px inset; padding-left: 0px; padding-bottom: 0px; margin: 0px; border-left: 0px inset; padding-top: 0px; border-bottom: 0px inset">
<div style="display: none">
<div style="margin: 5px 20px 20px">
<div class="smallfont" style="margin-bottom: 2px"><font face="Verdana"><b>Bu derste A.J yünüzü kullanıyoruz</b></font></div>
<table id="table1" height="1" width="619" bordercolorlight="#000080" border="0">
<tbody>
<tr>
<td valign="top" align="left" width="221" height="1">
<p align="center"><b><font color="#ff0000" size="4">1.Adım</font></b><img height="248" alt="" width="201" align="top" src="http://img205.echo.cx/img205/6240/resim12fr.jpg" /><span class="Apple-style-span" style="font-size: 13px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif"><span class="Apple-style-span" style="word-spacing: 0px; font: medium 'Times New Roman'; text-transform: none; color: rgb(0,0,0); text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><br />
</span></span><span class="Apple-style-span" style="font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif"><span class="Apple-style-span" style="font-weight: 700; word-spacing: 0px; text-transform: none; color: rgb(0,0,0); text-indent: 0px; line-height: normal; font-style: normal; font-family: Verdana; white-space: normal; letter-spacing: normal; border-collapse: separate; font-variant: normal; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><font size="1">İlk işimiz A.J. nin suratını seçmek. <br />
Bu iş için “Polygonal Laso Tools” kullanmayı <br />
uygun görüyorum.</font></span></span></p>
</td>
<td valign="top" align="left" width="216" height="1">
<p align="center"><font color="#ff0000" size="4"><b>2</b></font><b><font color="#ff0000" size="4">.Adım</font></b><br />
<img height="262" alt="" width="187" src="http://img210.imageshack.us/img210/1822/sisefekti0052eh4vz.jpg" /></p>
</td>
<td valign="top" align="left" width="180" height="1">
<p align="center"><font color="#ff0000" size="4"><b>3</b></font><b><font color="#ff0000" size="4">.Adım</font></b><img height="184" alt="" width="213" src="http://img210.imageshack.us/img210/1971/sisefekti0052eh0nb.jpg" /><span class="Apple-style-span" style="font-size: 13px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif"><span class="Apple-style-span" style="word-spacing: 0px; font: medium 'Times New Roman'; text-transform: none; color: rgb(0,0,0); text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><br />
</span><span class="Apple-style-span" style="font-size: 10pt; word-spacing: 0px; text-transform: none; color: rgb(0,0,0); text-indent: 0px; line-height: normal; font-style: normal; font-family: Verdana; white-space: normal; letter-spacing: normal; border-collapse: separate; font-variant: normal; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px">Seçim bittikten sonra CTRL + C ile kopyalıyoruz. Sonra B.S. nin resmine CTRL + V tuş kombinasyonu ile yapıştırıyoruz. Daha sonra yapıştırdığımız parçayı istediğim boyuta ve istediğimiz yere getirmek için CTRL + T ile şekillendiriyoruz</span></span></p>
</td>
</tr>
<tr>
<td valign="top" align="center" width="221" height="1"><font color="#ff0000" size="4"><b>4</b></font><b><font color="#ff0000" size="4">.Adım</font></b><img height="209" alt="" width="202" src="http://img210.imageshack.us/img210/7381/resim48xw8de.jpg" /><br />
<span class="Apple-style-span" style="word-spacing: 0px; font: medium 'Times New Roman'; text-transform: none; color: rgb(0,0,0); text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 13px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif">Daha sonra yapıştırdığımız layerın fazlalıklarını silgi aracı ile siliyoruz. Burada dikkat etmemiz gereken en önemli nokta silginin düşük oppacity ile kullanılmasıdır.</span></span></td>
<td valign="top" align="center" width="216" height="1"><font color="#ff0000" size="4"><b>5</b></font><b><font color="#ff0000" size="4">.Adım</font></b><img height="200" alt="" width="192" src="http://img210.imageshack.us/img210/2575/sisefekti0052eh3up.jpg" /><br />
<span class="Apple-style-span" style="word-spacing: 0px; font: medium 'Times New Roman'; text-transform: none; color: rgb(0,0,0); text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 13px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif">Yüzü tam uyacak şekilde yerleştirdikten sonra en önemli kısma geliyoruz yani rengi ayarlamaya. Bildiğiniz gibi renk tonlarındaki en ufak bir farklılık resimdeki inandırıcılığı bitiriyor.Yuzun boyutunu kucultmek ve buyutmek için edit > free transform yapın</span></span></td>
<td valign="top" align="center" width="180" height="1"><font color="#ff0000" size="4"><b>6</b></font><b><font color="#ff0000" size="4">.Adım</font></b><img height="209" alt="" width="214" src="http://img210.imageshack.us/img210/5232/resim64ll6ev.jpg" /><span class="Apple-style-span" style="word-spacing: 0px; font: medium 'Times New Roman'; text-transform: none; color: rgb(0,0,0); text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 13px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif"><br />
Resimdeki renkleri düzenlemek için layerdaki “Hue-Saturation” ve “Brigtness-Contrast” ayarlarıyla oynuyoruz.</span></span></td>
</tr>
</tbody>
</table>
<p> </p>
<p> </p>
</div>
</div>
</div>
</div>
<div style="margin: 0px">
<div class="smallfont" style="margin-bottom: 2px"> <input type="button" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Dersi Gizle'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Saç Rengini Değiştirme Nasıl Yapılır--Dersi Göster'; }" style="padding-right: 3px; padding-left: 3px; font-weight: bold; font-size: 10pt; padding-bottom: 7px; margin: 8px; width: 338px; padding-top: 7px; font-family: Verdana; height: 33px" value="Saç Rengini Değiştirme Nasıl Yapılır-Dersi Göster" /></div>
<div class="alt1" style="border-right: 0px inset; padding-right: 0px; border-top: 0px inset; padding-left: 0px; padding-bottom: 0px; margin: 0px; border-left: 0px inset; padding-top: 0px; border-bottom: 0px inset">
<div style="display: none">
<div style="margin: 5px 20px 20px">
<div class="smallfont" style="margin-bottom: 2px"><font face="Verdana">Bu Bölümde ise saç rengi nasıl değiştirilir onu göreceğiz.Sizde resimde gördüğünüz her hangi bir resim üzerinde veya kendi resminiz üzerinde çalışabilirsiniz</font></div>
<div align="left">
<table id="table2" height="1" width="593" bordercolorlight="#000080" border="0">
<tbody>
<tr>
<td valign="top" align="left" width="202" height="1">
<p align="center"><b><font color="#ff0000" size="4">1.Adım</font></b><img height="353" alt="" width="266" src="http://img406.imageshack.us/img406/5567/orjinal4wu.jpg" /><span class="Apple-style-span" style="font-size: 13px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif"><span class="Apple-style-span" style="word-spacing: 0px; font: medium 'Times New Roman'; text-transform: none; color: rgb(0,0,0); text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><br />
</span></span><span class="Apple-style-span" style="word-spacing: 0px; font: medium Times New Roman; text-transform: none; text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px">İlk olarak layer palette' deki (yarısı beyaz yarısı siyah daire)<br />
"create new adjustment layer" butonuna tıklıyoruz.</span></span></p>
</td>
<td valign="top" align="left" width="310" height="1">
<p align="center"><font color="#ff0000" size="4"><b>2</b></font><b><font color="#ff0000" size="4">.Adım</font></b><br />
<img height="360" alt="" width="310" src="http://img406.imageshack.us/img406/492/colorbalance6qz.gif" /><b><span class="Apple-style-span" style="word-spacing: 0px; font: medium 'Times New Roman'; text-transform: none; color: rgb(0,0,0); text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; color: rgb(77,82,140); font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px"><br />
</span></span><span class="Apple-style-span" style="word-spacing: 0px; font: medium Times New Roman; text-transform: none; text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px">burada açılan menüden "color balance" ı seçiyoruz. ve aşağıdaki değerleri aynen giriyoruz.</span></span></b></p>
</td>
</tr>
<tr>
<td align="center" width="587" colspan="2" height="1"><b><font color="#ff0000" size="4">3.Adım</font></b><br />
<img height="245" alt="" width="499" src="http://img406.imageshack.us/img406/1434/highlights3gi.gif" /><b><font color="#ff0000" size="4"><br />
4.Adım<br />
</font></b><img height="249" alt="" width="486" align="middle" src="http://img406.imageshack.us/img406/658/midtones9bb.gif" /><br />
<font color="#ff0000" size="4"><b>5</b></font><b><font color="#ff0000" size="4">.Adım</font></b><br />
<img height="247" alt="" width="490" src="http://img406.imageshack.us/img406/6947/shadows1pb.gif" /><br />
<span class="Apple-style-span" style="word-spacing: 0px; font: medium Times New Roman; text-transform: none; text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px">resmimiz bunları uyguladıktan sonra kırmızı bir görünüm alacak.</span></span></td>
</tr>
<tr>
<td align="center" width="273" height="1"><font color="#ff0000" size="4"><b>6</b></font><b><font color="#ff0000" size="4">.Adım<br />
</font></b><img height="201" alt="" width="250" src="http://img406.imageshack.us/img406/6789/foreground6sm.jpg" /><b><font color="#ff0000" size="4"><br />
</font><span class="Apple-style-span" style="word-spacing: 0px; font: medium Times New Roman; text-transform: none; text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px">bundan sonra "foreground color" 'ı siyah yapıyoruz</span></span></b></td>
<td align="center" width="310" height="1"><b><font color="#ff0000" size="4">7.Adım<br />
</font></b><img height="383" alt="" width="157" align="left" src="http://img406.imageshack.us/img406/8955/siyahrenk4rz.gif" />
<p align="left"><span class="Apple-style-span" style="word-spacing: 0px; font: medium Times New Roman; text-transform: none; text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px">ve sonra da "layer<br />
mask"'ı siyahla dolduruyoruz(doldurma işleminin kısayolu alt+backspace<br />
tuşu). başka bir yol da menüden edit/fill use foreground color Bunu yapıncada resimdeki kırmızılık gidecektir.</span></span></p>
</td>
</tr>
<tr>
<td align="center" width="229" height="1"><font color="#ff0000" size="4"><b>8</b></font><b><font color="#ff0000" size="4">.Adım<br />
</font></b><img height="238" alt="" width="263" src="http://img406.imageshack.us/img406/2263/boya7pc.jpg" /><span class="Apple-style-span" style="word-spacing: 0px; font: medium Times New Roman; text-transform: none; text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px"><br />
Daha sonra "foreground color" tekrar beyaz yapıyoruz ve sonra "brush<br />
tool" seçip saçı boyamaya başlıyoruz</span></span></td>
<td align="center" width="310" height="1"><font color="#ff0000" size="4"><b>9</b></font><b><font color="#ff0000" size="4">.Adım<br />
</font></b><img height="228" alt="" width="285" src="http://img406.imageshack.us/img406/9813/blending5tz.jpg" /><br />
<span class="Apple-style-span" style="word-spacing: 0px; font: medium Times New Roman; text-transform: none; text-indent: 0px; white-space: normal; letter-spacing: normal; border-collapse: separate; orphans: 2; widows: 2; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px"><span class="Apple-style-span" style="font-size: 12px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px">Boyama işlemimiz bitince "layer palatte" deki blending ayarını<br />
normal'den color'a getiriyoruz. en son olarak da opacity değerini resim<br />
daha gerçekçi gözükene kadar düşürüyoruz.</span></span></td>
</tr>
<tr>
<td align="center" width="587" colspan="2" height="1"><font face="Verdana"><b><font size="7"><img height="424" alt="" width="428" align="left" src="http://img406.imageshack.us/img406/6818/final2bw.gif" /></font></b></font><b><font face="Verdana" color="#ff0000" size="4">İşte<br />
Sonuç <br />
Final Resmi</font></b></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div style="margin: 0px">
<div class="alt1" style="border-right: 0px inset; padding-right: 0px; border-top: 0px inset; padding-left: 0px; padding-bottom: 0px; margin: 0px; border-left: 0px inset; padding-top: 0px; border-bottom: 0px inset">
<div style="display: none">
</div>
</div>
</div>
<div> </div></body>
</html>