Beşiktaş.Us

Beşiktaş Haber Portalı

SinerjiSoft için hazırladığım Beşiktaş Haber Sitesi tasarımının script giydirilmesi tamamlandı ve site yayın hayatına beta olarak basladı.

Siteye Katkım:

 Tasarım, Xhtml ve Css Kodlama

SinerjiSoft.Com Beşiktaş.Us - Ziyaret Et

Bağlantılara (Linklere) Küçük Önizleme Resmi

tarih 01 Eylül 2009 yazarMustafa AYDIN
Kategori: 
CSS, Javascript, Web Tasarım

Bazı sitelerde görürüz, var olan bağlantıların üzerine gittiğimizde açılacak olan sitenin küçük bir resmi gösterilir. İşte bunu ufak bir javascript ve css ile halledebiliriz. İlk olarak sayfanın en altında bulunan download butonuna tıklayarak gerekli dosyaları indirin. Bu .rar içerisinde iki adet dosya çıkacak. Biri javascript dosyası biri de image…

Şimdi ilk olarak javascript dosyamızı sitemizde head kodları arasına şu kodla ekleyelim (Not: Dosyalar sitenizin ana dizininde olduğu düşünülerek dosya yolu belirtilmiştir. Eğer başka bir dizine koyarsanız o yolu değiştirmeyi unutmayın.):

1
<script language="JavaScript" type="Text/JavaScript" src=" arc90_linkthumb.js"></script>

Şimdi de css kodlarımız arasına şu kodu da ekleyelim:

1
2
3
4
5
.arc90_linkpic { display: none; position: absolute; left: 0; top: 1.5em; } 
.arc90_linkpicIMG {
 padding: 0 4px 4px 0; 
background: #FFF url(linkpic_shadow.gif) no-repeat bottom right;
 }

devamını oku

JQuery İle IE6 İçin Transparan PNG (Hem Arkaplanda Hem de Resimlerde)

tarih 25 Ağustos 2009 yazarMustafa AYDIN
Kategori: 
Javascript, Web Tasarım

jqueryIE6’nın bir problemi de transparan png dosyalarını sitemizde transparan olarak göstermemesidir. Hal böyle olunca da gif formatına göre daha avantajlı olan png dosyaları bir çok kez kullanamayız. İşte bu script sayesinde bu sorunun üstesinden de geleceğiz. Tabii bundan JQuery’den faydalanacağız.

Gelelim nasıl kullanılacağına. Öncelikle şu dosyayı indirelim: jquery_pngfix.rar

Sonrasında içinden çıkan iki JavaScript dosyasını sitemizin ana dizinine atalım ve html kodlarından <head></head> tagları arasına şu kodları ekleyelim:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<head> 
... 
 
<script type="text/javascript" src="jquery-latest.pack.js"></script> 
<script type="text/javascript" src="jquery.pngFix.js"></script> 
 
<script type="text/javascript"> 
    $(document).ready(function(){ 
        $(document).pngFix(); 
    }); 
</script> 
 
... 
</head>

Bu kodlardan ilk ikisi javascript dosyalarımızı sitemize ekler. Son ve yedinci satırdan başlayan kodumuz sitemizde pngFix sistemini aktif duruma getirir. Her şey hazır. Peki resim dosyalarını sitemizde nasıl kullanırsak png dosyalarımız IE6’da da transparan olur? Aşağıdaki örnek kodları inceleyerek siz de kullanabilirsiniz:

devamını oku