Yeni Kayıt
Konudaki Resimler
|
Hızlı 
Bildirim
Slider üstüne menü nasıl yapılır?
Sıcak Fırsatlarda Tıklananlar
Editörün Seçtiği Fırsatlar
CAMPER Erkek Pix Ayakkabı : Amazon.com.tr: Moda
https://www.amazon.com.tr/dp/B08BCQ7XJB
6 sa. önce paylaşıldı
Bu Konudaki Kullanıcılar:
2 Misafir - 2 Masaüstü
Giriş
Mesaj
-
-
bu sitedeki gibi ? -
quote:
Orijinalden alıntı: ismailix
bu sitedeki gibi ?
Reklam olmasın diye.. Adresi değil sadece bu sitedeki yazdım üzerine tıklanınca siteye girecek o sitenin sahibiyle ya da iş yeriyle yakından uzaktan alakam yok reklam olmaması için öyle yazdım. -
pm olarak gönderin o zman. -
quote:
Orijinalden alıntı: ismailix
pm olarak gönderin o zman.
Böyle bir yazı kurallara aykırı değildir. PM atmak zorunda değilim önemli olan web tasarım & kodlama ile ilgilenen bir çok arkadaşların bu konuyu incelemesi ve çözümü biliyorlarsa isteğe bağlı olarak yardımcı olmaya katkı sağlayabilirler. -
:) tamam arkadaşım. -
position: absolute; ve z-index xxx ; ne demek olduğunu kavrayabilirsen o şekilde yapabilirsin -
quote:
Orijinalden alıntı: Hapsher
position: absolute; ve z-index xxx ; ne demek olduğunu kavrayabilirsen o şekilde yapabilirsin
Evet öyle olur ama her ekranın büyüklüğüne göre pozisyon yeri falan farklı görülebilir ekran boyutunun büyüklüğüne bağlı yer değiştiriyor diye biliyorum başka yolu var mı biliyorsanız onu öğrenmek istioyrum.. -
Online çalışıyorsan sitenin linkini ver bakalım.
Online çalışmıyorsan index kodlarını buraya ekle bakalım.
Buarada bu şekilde istiyorsun değilmi yanlışlık olmasın
< Bu mesaj bu kişi tarafından değiştirildi bilmaster -- 7 Ekim 2013; 15:17:23 > -
quote:
Orijinalden alıntı: ogsbilisim
Online çalışıyorsan sitenin linkini ver bakalım.
Online çalışmıyorsan index kodlarını buraya ekle bakalım.
Buarada bu şekilde istiyorsun değilmi yanlışlık olmasın
Domain aldım siteyi tasarlayacağım daha tasarlamadım ama o sitedeki tasarım gibi (sadece slider ve üstündeki menü gibi yani sliderin üstünde olacak bir menü slider arka planda kalacak) yapmayı düşünüyorum
Slider Jquery olacak üstünde menü olacak şimdilik bir çalışmam yok. Sadece soruyorum böyle Jquery ya da bir resmin üzerine başka bir resim ya da Jquery-Slider eklemek nasıl oluyor? nasıl yapabilirim?
-
Ufak bişey hazırlayım sana ona göre düzenlemeleri yaparsın. -
quote:
Orijinalden alıntı: ogsbilisim
Online çalışıyorsan sitenin linkini ver bakalım.
Online çalışmıyorsan index kodlarını buraya ekle bakalım.
Buarada bu şekilde istiyorsun değilmi yanlışlık olmasın
Az önce yorumunuzda görsel görülmediği için farketmedim evet dediğiniz gibi olsun istiyorum. -
Sanırım bu işini görür sadece header;
<!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>Başlıksız Belge</title>
<style type="text/css">
.header
{
width:980px;/*--genişlik ayarı--*/
height:auto;/*--yükseklik ayarı--*/
margin:0 auto;/*--alanı ortalama için kullanılır--*/
position:relative;/*--ilişkilendirme için kullanılır--*/
background-color:#000; /*--arkaplan rengi--*/
}
.header-ust-alan
{
width:970px;
height:100px;
position:relative;
left:5px;
float:left;
background-color:#FFF;
}
.header-ust-alan-logo
{
width:600px;
height:100px;
position:relative;
float:left;
background-color:#3CF;
}
.header-ust-alan-sag
{
width:350px;
height:100px;
position:relative;
float: right;
background-color: #CCC;
}
.header-ust-alan-sag-dil
{
width:350px;
height:35px;
position:relative;
float: right;
background-color: #FFF;
margin-bottom:5px;
}
.header-ust-alan-sag-iletisim
{
width:350px;
height:60px;
position:relative;
float: right;
background-color: #FFF;
}
.slider-menu
{
width:970px;
height:350px;
position:relative;
left:5px;
float:left;
background-color: #666;
}
.slider
{
width:970px;
height:350px;
position:relative;
float:left;
line-height:350px;
text-align:center;
font-size:36px;
color:#FFF;
}
.menu
{
width:950px;
height:40px;
position: absolute;
left:10px;
line-height:40px;
text-align:center;
background: rgb(204,201,201); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NjYzljOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZmZmNmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjY2M5YzkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, rgb(204,201,201) 0%, rgb(255,252,252) 50%, rgb(204,201,201) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(204,201,201)), color-stop(50%,rgb(255,252,252)), color-stop(100%,rgb(204,201,201))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccc9c9', endColorstr='#ccc9c9',GradientType=0 ); /* IE6-8 */
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
border:solid 1px #333333;
margin-top:-20px;
}
.temizle
{
clear:both
}
</style>
</head>
<body>
<div class="header"><!--header başladı-->
<div class="header-ust-alan"><!--üst alan başladı-->
<div class="header-ust-alan-logo"><!--logo başladı-->
LOGO RESMİ BURADA OLACAK
</div><!--logo bitti-->
<div class="header-ust-alan-sag"><!--header sag başladı-->
<div class="header-ust-alan-sag-dil">
Dil Bilgileri
</div>
<div class="header-ust-alan-sag-iletisim">
İletişim Bilgileri
</div>
</div><!--header sag bitti-->
</div><!--üst alan bitti-->
<div class="slider-menu"><!--slider menu başladı-->
<div class="menu">
menu
</div>
<div class="slider">
SLİDER BURADA OLACAK
</div>
</div><!--slider menu bitti-->
<div class="temizle"></div><!--buda temizlik :) -->
</div><!--header bitti-->
</body>
</html>
-
quote:
Orijinalden alıntı: ogsbilisim
Sanırım bu işini görür sadece header;
<!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>Başlıksız Belge</title>
<style type="text/css">
.header
{
width:980px;/*--genişlik ayarı--*/
height:auto;/*--yükseklik ayarı--*/
margin:0 auto;/*--alanı ortalama için kullanılır--*/
position:relative;/*--ilişkilendirme için kullanılır--*/
background-color:#000; /*--arkaplan rengi--*/
}
.header-ust-alan
{
width:970px;
height:100px;
position:relative;
left:5px;
float:left;
background-color:#FFF;
}
.header-ust-alan-logo
{
width:600px;
height:100px;
position:relative;
float:left;
background-color:#3CF;
}
.header-ust-alan-sag
{
width:350px;
height:100px;
position:relative;
float: right;
background-color: #CCC;
}
.header-ust-alan-sag-dil
{
width:350px;
height:35px;
position:relative;
float: right;
background-color: #FFF;
margin-bottom:5px;
}
.header-ust-alan-sag-iletisim
{
width:350px;
height:60px;
position:relative;
float: right;
background-color: #FFF;
}
.slider-menu
{
width:970px;
height:350px;
position:relative;
left:5px;
float:left;
background-color: #666;
}
.slider
{
width:970px;
height:350px;
position:relative;
float:left;
line-height:350px;
text-align:center;
font-size:36px;
color:#FFF;
}
.menu
{
width:950px;
height:40px;
position: absolute;
left:10px;
line-height:40px;
text-align:center;
background: rgb(204,201,201); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NjYzljOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2ZmZmNmYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjY2M5YzkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, rgb(204,201,201) 0%, rgb(255,252,252) 50%, rgb(204,201,201) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(204,201,201)), color-stop(50%,rgb(255,252,252)), color-stop(100%,rgb(204,201,201))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgb(204,201,201) 0%,rgb(255,252,252) 50%,rgb(204,201,201) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccc9c9', endColorstr='#ccc9c9',GradientType=0 ); /* IE6-8 */
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
border:solid 1px #333333;
margin-top:-20px;
}
.temizle
{
clear:both
}
</style>
</head>
<body>
<div class="header"><!--header başladı-->
<div class="header-ust-alan"><!--üst alan başladı-->
<div class="header-ust-alan-logo"><!--logo başladı-->
LOGO RESMİ BURADA OLACAK
</div><!--logo bitti-->
<div class="header-ust-alan-sag"><!--header sag başladı-->
<div class="header-ust-alan-sag-dil">
Dil Bilgileri
</div>
<div class="header-ust-alan-sag-iletisim">
İletişim Bilgileri
</div>
</div><!--header sag bitti-->
</div><!--üst alan bitti-->
<div class="slider-menu"><!--slider menu başladı-->
<div class="menu">
menu
</div>
<div class="slider">
SLİDER BURADA OLACAK
</div>
</div><!--slider menu bitti-->
<div class="temizle"></div><!--buda temizlik :) -->
</div><!--header bitti-->
</body>
</html>
Hocam ellerinize sağlık güzel çalıştı sağolun.
Peki bunun mantığı ne nasıl yaptınız? Div Tagleri sıra sıra nasıl eklediniz böyle olması için? Yarın öbürsü gün bu kodları kaybedersem elbette bu sayfayı arayacağım ama yinede yapımını öğrenmiş olayım dedim.
Teşekkürler hocam.
-
Bu sorunun gelecegini tahmin ettiğim için div lerin başlangıç ve bitişlerini yazdım :D css leride kontrol ederseniz mantık ortaya çıkar .
Buarada rica ederim güle güle kullan. -
quote:
Orijinalden alıntı: ogsbilisim
Bu sorunun gelecegini tahmin ettiğim için div lerin başlangıç ve bitişlerini yazdım :D css leride kontrol ederseniz mantık ortaya çıkar .
Buarada rica ederim güle güle kullan.
Dün menünün üzerinde olduğunu gördüm ama slider ı denemedim bugün denedim ve gördüğüm kadarıyla Slider menünün üzerinde oluyor buna çare arıyorum şuan
<div="slider">
<- Jquery slider kodu ->
<div="menu>
ana sayfa hakkımızda vs...
</div>leri de kapatıyorum ama menü üzerinde olamıyor sliderın -
.menu --- z-index:100; ekle eğer yine alta kalırsa 100 artırarak dene olmazsa.
Şuan müsait değilim ama dosyalarınızı bana gönderirseniz hallederim. -
hocam illaki gönderdiğiniz tasarımmmı olacak? -
Pm Olarak dosyayı gönderdim umarım işini görür.
Dosyaların düzenlemesini artık yaparsın.
< Bu mesaj bu kişi tarafından değiştirildi bilmaster -- 9 Ekim 2013; 11:02:43 > -
Hocam ellerinize sağlık çok güzel olmuş başarılı olmuş. Anladığım kadarıyla benim sliderda sorun vardı diye menüyü üste alamadım başka bir slider kullanmışsınız ondna mı kaynaklanıyor yoksa başka bir durum mu?
Ellerinize sağlık hocam.
Benzer içerikler
- yazı netleştirme
- e-ticaret yapanların yorumları
- fotoğraftaki yazıyı değiştirme
- çizim programları
- font bulma
Ip işlemleri
Bu mesaj IP'si ile atılan mesajları ara Bu kullanıcının son IP'si ile atılan mesajları ara Bu mesaj IP'si ile kullanıcı ara Bu kullanıcının son IP'si ile kullanıcı ara
KAPAT X
Bu mesaj IP'si ile atılan mesajları ara Bu kullanıcının son IP'si ile atılan mesajları ara Bu mesaj IP'si ile kullanıcı ara Bu kullanıcının son IP'si ile kullanıcı ara
KAPAT X
