Div içinde link kullanımı

Kodla Büyü

burak0692

Site Gezgini
Mesajlar
53
Selam arkadaşlar bugün bu 2.konum web sitesi hakkında şimdiki sorum şu daha önceden de sormuştum ama yapamadım maalesef.

Aşşağıdaki resimdeki gibi sol taraftaki menüden veya üst taraftaki menüden linklere tıkladığımda sayfa değişmeyecek. Sadece ortadaki pembe alan değişecek.
Yani linklere tıkladığımda yeni sayfa olarak değil sayfa değişmeden sadece ortadaki div de açılacak. Daha önceden kod olarak yardımcı oldunuz ama yapamadım. Tekrar anlatırsanız sevinirim.

 
save as yöntemi yapabilirsiniz hocam sayfayı farklı kaydederek sadece ortadaki pembe alanı değiştirebilirsiniz ama alan artar bu şekilde yada
ortaya div koyup link verilebilir yada iframe :)
 
bildiğim kadarı ile bunu ortada frame kullanarak,
<iframe name="oku"> </iframe>
şeklinde
<a href='link.html' target='oku' >tıkla</a>

böyle diye biliyorum
 
bu işi tabiki en iyi iframe kodu yapar çelikumut kodları yazmış,
bende kendi sitemede iframe kullanıyorum güncellerken de kolaylık oluyor
 
jquery'de ajax fonksiyonunu kullanabilirsin. çok zor birşey değil biraz araştır ajax diye.
 
<a href=# onclick="javascript:JXG('sayfa.html','divadi');">Link Adı</a>
gibi bir kod kullanabilirsiniz hocam. Burada JXG() ajax ile sayfa yüklemesi yapmak için kullanacağınız fonksiyon. Bir ara kodları bende vardı ama şu an nerede olduğunu bilmediğim için gönderemiyorum. JQuery ile de çok rahat bir şekilde yapabilirsiniz.
Ama link in kullanımı bu şekilde.
 
maalesef yine yapamadım ortadaki divin içinde açmayı.. Kodları bunlar tekrar yardımcı olursanız sevinirim.

Kodların hepsi aşşağıdaki ortadaki Divin Adı #Main



<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Azem Halı Yıkama</title>


<style type="text/css">
a:link {text-decoration: none; color: white;}
a:hover {text-decoration: underline; color: white;}


*{
padding:0px;
margin:0px;}
#sayfa{
top: auto;
right: auto;
color:#FFFFFF;
background-color:#FF0033;
margin-top: 5px;
margin-right: 100px;
margin-bottom: 5px;
margin-left: 100px;


}
#banner{
height:200px;
background-color:#FF0033;
width:1137px;
padding: 5px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
#nav{
float:left;
background-color:#FF0000
padding: 0px;
height: 700px;
margin: 5px;
border: 1px solid #000000;
width: 20%;
font-style: normal;
font-weight: bold;
color:#FFFFFF;

}
#main{
float:left;
width: 52%;
background-color:#FFFFFF;
padding: 0px;
margin: 5px;
border: 1px solid #000000;
height: 700px;
}
#side{
float:left;
background-color:#FF0033;
height: 700px;
margin: 5px;
border: 1px solid #000000;
width:24%
}
#footer{
color: #000000;
background-color: #FFFFFF;
margin: 5px;
height: 30px;
border:1px solid #000000;
clear: left;
padding: 5px;
width:%30;
}




.stil18 {
font-weight: bold;
color: #FF0000;
}
body,td,th {
color: #FFFFFF;
}
a:visited {
color: #FFFFFF;
text-decoration: none;
}
a:active {
color: #FFFFFF;
text-decoration: none;
}
.stil19 {color: #000000}
.stil20 {
color: #FF0000;
font-style: italic;
}
.stil21 {
color: #FF0033;
font-style: italic;
}
.stil23 {color: #FF0033}
.stil24 {color: #000000; font-style: italic; }
.stil27 {
font-size: 24px;
font-style: italic;
}
</style>

</head>

<body>
<div id="sayfa">
<div id="banner">
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><img src="Resimler/logo.png" width="744" height="117" /></p>
<p align="right" class="stil17"><em><strong>0.312 314 04 42</strong></em></p>
<p align="right" class="stil6"><em><strong>azemhaliyikama@hotmail.com.tr</strong></em></p>
<p align="right" class="stil6">&nbsp;</p>
</div>
<table width="1146" border="1">
<tr>

<td height="24" class="stil1"><div align="center"><em><strong><a href="index.htm.html">Anasayfa</a></strong></em></div></td>
<td class="stil1"><div align="center"><em><strong>Hakkımızda</strong></em></div></td>
<td class="stil1"><div align="center"><em><strong>Fiyatlarımız</strong></em></div></td>
<td class="stil1"><div align="center"><a href="fotogaleri.html"><em><strong>Foto Galeri</strong></em></a></div></td>
<td class="stil1"><div align="center"><em><strong>İletişim</strong></em></div></td>
<td class="stil1"><div align="center"><em><a href="iletisimformu.html" target="_blank" ><strong> İletişim Formu</strong></a></em></div></td>
</tr>
</table>
<div id="nav">
<div align="center" class="stil4">
<p><em>Hizmetlerimiz</em></p>
<p>&nbsp;</p>
<blockquote>
<p><em>Halı Yıkama</em></p>
<p>&nbsp;</p>
<p><em>Yerinde Halı Yıkama</em></p>
<p>&nbsp;</p>
<p><em>Overlok</em></p>
<p>&nbsp;</p>
<p><em>Ev Temizlik Hizmetleri</em></p>
<p>&nbsp;</p>
<p><em>Yatak Yıkama</em></p>
<p>&nbsp;</p>
<p><em>Perde Yıkama</em></p>
<p>&nbsp;</p>
<p><em>Yorgan Yıkama</em></p>
<p>&nbsp;</p>
</blockquote>
<p>-----------------------------------</p>


<p class="stil27">&nbsp;</p>
<p class="stil27">Doğru Adrestesiniz&nbsp;
</p>

</p>
<p><img src="Anasayfaresimleri/8.png" alt="" align="left" width="230" height="300">&nbsp;&nbsp;</p>
</div>
</div>
<div class="stil6 stil18 stil19" id="main">
<p>&nbsp;</p>
<p align="center" class="stil24">&nbsp;</p>
<p align="center" class="stil24">&nbsp;</p>
<p align="center" class="stil24">&nbsp;</p>
<p align="center" class="stil24">&nbsp;</p>
<p align="center" class="stil24">Azem Halı Yıkama Web Sitesine Hoş Geldiniz.</p>
<p align="center" class="stil20 stil23">&nbsp;</p>
<p align="center" class="stil21">Hijyenik, garantili yerinde halı yıkama, koltuk yıkama ve </p>
<p align="center" class="stil21">temizlik hizmeti anlayışıyla, cazip fiyatlarımız, zamanında</p>
<p align="center" class="stil21">teslimat, dürüst hizmet anlayışıyla, dört mevsim sizlerle</p>
<p align="center" class="stil21">hizmetteyiz.</p>
<p align="center" class="stil21">&nbsp;</p>
<p align="center" class="stil21">Fabrikmızda son sistem santfruj kurutma ve havalandırma</p>
<p align="center" class="stil21">sonrasında ambalanajlanarak adresinize teslim edilen</p>
<p align="center" class="stil21">halılarınızın ışıltısını ve Bahar kokusunu </p>
<p align="center" class="stil21">hissedeceksiniz.</p>
<p align="center" class="stil21">&nbsp; </p>
<p align="center" class="stil23"><em>Fabrika, evinize gelen ücretsiz servis aracımız halılarınızı</em></p>
<p align="center" class="stil23"><em>makbuz karşılığı teslim alır. Cinsine ve Özelliğine göre</em></p>
<p align="center" class="stil23"><em>ayırt edilen halı; halılar üzerinde yaşayan, gözle</em></p>
<p align="center" class="stil23"><em>görülemeyen fakat sayıları yüzbinleri bulan ev</em></p>
<p align="center" class="stil23"><em>tozu akarlarına karşı etkili dezenfektan</em></p>
<p align="center" class="stil23"><em>karışımlı özel kimyasallarımız ile </em></p>
<p align="center" class="stil23"><em>sektörde kabul görmüş en iyi</em></p>
<p align="center" class="stil23"><em>makina, sistem ve işcilik</em></p>
<p align="center" class="stil23"><em>ile derin bir temizlikten</em></p>
<p align="center" class="stil23"><em>geçer.</em></p>
<p align="center" class="stil23">&nbsp;</p>
<p align="center" class="stil23">&nbsp;</p>
<p align="center" class="stil23">&nbsp;</p>


</div>
<div id="side">
<div align="center">
<p><em><strong>Bizden Haberler</strong></em></p>
<p class="stil7">&nbsp;</p>
<span style="font-style: italic"> <span style="font-size: 18px">
<marquee align="middle" scrollamount="1" height="100" width="100%" direction="up" scrolldelay="1" style="color:#FFFFFF;">
<strong> Site Yapım Aşamasındadır.<br>
<br>
İletişim <br>burak_ozel@hotmail.com.tr<br />

</strong>
</marquee>
<br />
<br />
<br />
-------------------------------------
</span> </span></div>
<p>&nbsp;</p>
<p>burak</p>
</div>
<p>&nbsp;</p>

<table width="1145" border="1">
<tr>
<td><div align="center"><strong>Anasayfa</strong></div></td>
<td><div align="center"><em><strong>Hakkımızda</strong></em></div></td>
<td><div align="center"><em><strong>Fiyatlarımız</strong></em></div></td>
<td><div align="center"><strong><em>Foto Galeri</em></strong></div></td>
<td><div align="center"><em><strong>İletişim</strong></em></div></td>
<td><div align="center"><strong><em>İletişim Formu</em></strong></div></td>
</tr>
</table>
<p>&nbsp;</p>
</div>
</body>
</html>


 
BBNET
Geri
Üst