Merhaba, Ziyaretçi. Lütfen giriş yapın veya üye olun.
Aktivasyon mailiniz gelmediyse buraya tıklayın.
05, 2008, 08:56:07 am
 42712 Mesaj 9331 Konu Gönderen: 17904 Üye
Son üye: RafiX
Turk-Php.Com Forum  |  Yardım Forumları  |  HTML & JavaScript & XML Forumu  |  JavaScript Resim Gösterme « önceki sonraki »
Sayfa: [1] Yazdır
Yazan Konu: JavaScript Resim Gösterme  (Okunma Sayısı 1060 defa)
MaSCod3R
PHP Öğrencisi
*
Offline Offline

Mesaj Sayısı: 57

<?php include('yeni_php_ogreniyo.php'); ?>


Üyelik Bilgileri
JavaScript Resim Gösterme
« : 11, 2007, 08:17:39 am »
Arkdaşlar Şimdi Söyle Bisey Düşünün Resimdeki Gibi Ufak Resimler Yazan Yerlere Ve Devamın Ufak Olarak Hazırlanmış Resimler Koyulcak Sonra Ufak Resimlerin Üzerine Mouse Geldignde Ortada Büyük Şekli Gözükmesini İstiyorum Bunu Nasıl Yapabilirim Veya Elinde Örnek Kod Varmı
Logged
<?php include('yeni_php_ogreniyo.php'); ?>
engin
Admin
*
Offline Offline

Mesaj Sayısı: 495



Üyelik Bilgileri
Ynt: JavaScript Resim Gösterme
« Yanıtla #1 : 11, 2007, 01:31:11 pm »
aşağıdakine benzer şekilde olur sanırım

Kod:

<img src="foo_s.jpg" onmouseover="document.getElementById('big_img_container').innerHTML = '<img src=\'foo_b.jpg\' />';" />
Logged
[color=3399CC]Engin Dumlu[/color][/i]
[color=3399CC]engin ~ turk-php.com[/color]
[color=3399CC]achilles ~ member.turk-php.com[/color]
PHP5 Hosting
MaSCod3R
PHP Öğrencisi
*
Offline Offline

Mesaj Sayısı: 57

<?php include('yeni_php_ogreniyo.php'); ?>


Üyelik Bilgileri
Ynt: JavaScript Resim Gösterme
« Yanıtla #2 : 11, 2007, 06:16:16 pm »
Hocam Siz Bunu Yazdınız Bende Denedimde Ama Sonuç 0 Size Zahmet Siz Yazıp Deneyip Bana Gönderirmisiniz
Logged
<?php include('yeni_php_ogreniyo.php'); ?>
MaSCod3R
PHP Öğrencisi
*
Offline Offline

Mesaj Sayısı: 57

<?php include('yeni_php_ogreniyo.php'); ?>


Üyelik Bilgileri
Ynt: JavaScript Resim Gösterme
« Yanıtla #3 : 12, 2007, 08:19:22 am »
ben Çözümü Buldum Sizede Anlatım hemen ilk başta js kodumuzu <head></head> Arasına yazalım
Kod:
<SCRIPT TYPE="text/javascript" LANGUAGE="javascript">
<!--

/***********************************************
* Image Thumbnail Viewer II script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/

//Specify image paths and optional link (set link to "" for no link):
var dynimages=new Array()
dynimages[1]=["http://localhost/hidro/rsmler/1.jpg", ""]
dynimages[2]=["http://localhost/hidro/rsmler/2.jpg", ""]
dynimages[3]=["http://localhost/hidro/rsmler/3.jpg", ""]
dynimages[4]=["http://localhost/hidro/rsmler/4.jpg", ""]
dynimages[5]=["http://localhost/hidro/rsmler/5.jpg", ""]
dynimages[6]=["http://localhost/hidro/rsmler/6.jpg", ""]
dynimages[7]=["http://localhost/hidro/rsmler/7.jpg", ""]
dynimages[8]=["http://localhost/hidro/rsmler/8.jpg", ""]
dynimages[9]=["http://localhost/hidro/rsmler/9.jpg", ""]
dynimages[10]=["http://localhost/hidro/rsmler/10.jpg", ""]
dynimages[11]=["http://localhost/hidro/rsmler/11.jpg", ""]
dynimages[12]=["http://localhost/hidro/rsmler/12.jpg", ""]
//Preload images ("yes" or "no"):
var preloadimg="no"

//Set optional link target to be added to all images with a link:
var optlinktarget=""

//Set image border width
var imgborderwidth=0

//Optionally, change 1.0 and 0.7 below to affect Wipe gradient size and duration in seconds in IE5.5+:
var filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0 Duration=0.7)"

///////No need to edit beyond here/////

if (preloadimg=="yes"){
for (x=0; x<dynimages.length; x++){
var myimage=new Image()
myimage.src=dynimages[x][0]
}
}

function returnimgcode(theimg){
var imghtml=""
if (theimg[1]!="")
imghtml='<a href="'+theimg[1]+'" target="'+optlinktarget+'">'
imghtml+='<img src="'+theimg[0]+'" border="'+imgborderwidth+'">'
if (theimg[1]!="")
imghtml+='</a>'
return imghtml
}

function modifyimage(loadarea, imgindex){
if (document.getElementById){
var imgobj=document.getElementById(loadarea)
if (imgobj.filters && window.createPopup){
imgobj.style.filter=filterstring
imgobj.filters[0].Apply()
}
imgobj.innerHTML=returnimgcode(dynimages[imgindex])
if (imgobj.filters && window.createPopup)
imgobj.filters[0].Play()
return false
}
}

// -->
</SCRIPT>
Resimlere Link Verme
Kod:
<div align="center"><a href="#" onMouseover="modifyimage('dynloadarea', 8)"><img src="rsmler/8-k.jpg" width="128" height="128" border="0"></a>
ve 1 Adet div Yapmak onunda kodları bu
Kod:
<div id="dynloadarea" style="width:225px;height:225px" ></div>
resimlerin üzerine geldiginiz zmn ortada büyük hali açılıyo arabam.com dan çaldım Smiley
Logged
<?php include('yeni_php_ogreniyo.php'); ?>
samety
Ziyaretçi


E-Posta
Ynt: JavaScript Resim Gösterme
« Yanıtla #4 : 13, 2007, 01:55:05 pm »
baştan başlayalım
vazgeçtim sondan
Alıntı
resimlerin üzerine geldiginiz zmn ortada büyük hali açılıyo arabam.com dan çaldım Smiley
ben ce bu tabir çok yanlış biz burda herkes birşeyler öğrensin diye uğraşıyoruz.
burdan baktğımda
@engin in verdiği kod gayet doğru bir kod olarak gözüküyor.
o koda çalışmıyor demeden önce nasıl kullandığını yazsaydın hem kendin geliştirmiş olurdun hemde sonrakiler için bir fayda olurdu.

birde gözüme tkılan bir yanlış.
Alıntı
ben Çözümü Buldum Sizede Anlatım hemen ilk başta js kodumuzu <head></head> Arasına yazalım
bu yanlış bir tabir.
bu şart değil standarttır.

Alıntı
Arkdaşlar Şimdi Söyle Bisey Düşünün Resimdeki Gibi Ufak Resimler Yazan Yerlere Ve Devamın Ufak Olarak Hazırlanmış Resimler Koyulcak Sonra Ufak Resimlerin Üzerine Mouse Geldignde Ortada Büyük Şekli Gözükmesini İstiyorum Bunu Nasıl Yapabilirim Veya Elinde Örnek Kod Varmı
sadece bu soruya değil
bu forumdaki bir çok soruya yönelik söylüyorum keşke kod yerine nasıl diye bir sorunun cevabı aransa  Cry
Logged
MaSCod3R
PHP Öğrencisi
*
Offline Offline

Mesaj Sayısı: 57

<?php include('yeni_php_ogreniyo.php'); ?>


Üyelik Bilgileri
Ynt: JavaScript Resim Gösterme
« Yanıtla #5 : 14, 2007, 01:23:00 am »
haklısın samety hocam ama engin hocamın vredigi kodu anladım js bilgim okdr yok ztn :S o kodun altında çıkmazdım bende nette gezerken arabam.com gördüm baktım aynı işlevi yapıyo hemen aldım "çalmak" kelime çok yanlış bi tabir oldugunu biliyorum :S
Logged
<?php include('yeni_php_ogreniyo.php'); ?>
samety
Ziyaretçi


E-Posta
Ynt: JavaScript Resim Gösterme
« Yanıtla #6 : 14, 2007, 08:04:23 pm »
aslında karışık değil ve bence onu kendin düzenlemen çok daha yararlı olabilir
mesela
büyük resim göstereceğim tag
<div id="buyuktag"></div>




kücük resimleri diziyorum
<img src="1_kucuk_resim.jpg" onmouseover="javascript:document.getElementById('buyuktag').innerHTML='<img src="1_buyuk_resim.jpg">'">
.
.
.
.
.
 diye istediğin kadar gidebilir.
burda senin yapman bunu dinamik bir hale getirip kod ameleliğinden kurtulmak.
senin bulduğun örneğe gelirsek senin onu o şekilde yapmak statikleştirmiş olayı.
veritabanından aldığın bir değeri düşün mesela
sonsuz sayıda resim Smiley
farklı php döngüleriyle bunları dinamik bir şekilde tasarlayabilrsin.
ve burda bana göre en önemli katkı
sana istediğini elde etme değil istediğini yapma becerisi kazandırma olacaktır.
saygılarımla...
Logged
merakli
Yeni Kullanıcılar
*
Offline Offline

Mesaj Sayısı: 49


Üyelik Bilgileri
Ynt: JavaScript Resim Gösterme
« Yanıtla #7 : 19, 2007, 01:44:52 pm »
samety sana hak veriyorum gönül isterki bu formda herkes bir fikir atsın ve birbirimizin hatalarını görüp kendimizi böylece geliştirsek.
ama mascodr arkadaşımız da soruya duyarsız kalmamış ve arastıma yapmış onada bu uğraşısından dolayı tesekkür etmeliyiz. Çoğumuz ( ör: ben )
bazı sorulara erinip cevap vermediğimiz de oluyor.
umarım soruyu soran arkadaş (ki şimdi soruyu soranla cevap veren arkadaşın aynı olduğunu anlıyorum. Neyse yazdıklarım boşa gitmesin. laugh) samety nin cevabı anlamıştır yoksa bende bir el atmayı düşünüyorum.
Logged
en sevdiğim js kodu: setTimeout
Quatready
Yeni Kullanıcılar
*
Offline Offline

Mesaj Sayısı: 19


Üyelik Bilgileri
Ynt: JavaScript Resim Gösterme
« Yanıtla #8 : 20, 2007, 08:10:06 am »
engin arkadaşımızın verdiği cevap gerçekten çok güzel ve çok basit bir yöntem javascript bilgini çokta fazla sınamıyor
ve geliştirilmesi açısından bulunmaz bir hint kumaşı diyebilirim Smiley
gezerken gördüm
genelde bu tarzda çok fazla yanıtlar görüyorum
php yardım formunda da bu var

çok güzel anlaşılır bir örnek veriliyor fakat bazı arkadaşlar ben bunu yapamadım benim kodlarıma uyarlayıp yazar mısın diyorlar
bence çok yanlış
çok fazla acelem olsa bile gece 12 , 1 lere kadar çalışıp yanlışımı görmek nerde yanlış yaptığımı görmek isterim ben şahsen
ve keşke herkes öyle yapsa
hazır kodları kullanarak birşeyler yapmak bize hiç bir şey öğretmez olduğumuz yerde sayarız
ama mastercdr arkadaşımız da en azından bir şeyler bulup burada paylaşmış

ama benim görüşüm mastercdr bence engin arkadaşımızın verdiği kodu biraz incelemendir .
onu geliştirip çok güzel şeylerde yapabilirsin. hemde azıcık bişiler öğrenebilirsin.
şahsen çok karşılaşmama rağmen herhangi küçük bir form olarak kullanabilirim bunu bir yerde gerçekten çok güzel teşekkür ederim
Logged
chmod
PHP Öğrencisi
*
Offline Offline

Mesaj Sayısı: 128



Üyelik Bilgileri
Ynt: JavaScript Resim Gösterme
« Yanıtla #9 : 29, 2008, 09:21:40 pm »
engin arkadaşın verdiği kod gerçekten de en mantıklısı, seninki kadar uğraşmaya gerek yok.

Tepedeki resimler için basitçe

Kod:
<a onmouseover="document.ORTARESIM.src='resim1.jpg'" onmouseout="document.ORTARESIM.src='default.jpg'">
<img src="1.jpg"></a>

ve ortadaki resim için
Kod:
<img name="ORTARESIM" src="default.jpg">
Logged
<?php
//chmod start
echo "Hello World";
//chmod stop
?>
Sayfa: [1] Yazdır 
« önceki sonraki »
Gitmek istediğiniz yer:  


MySQL ile Güçlendirildi PHP ile Güçlendirildi XHTML 1.0 Geçerli! CSS Geçerli!
Turk-Php.Com Forum | SMF Forum Software © 2005, Simple Machines LLC. All Rights Reserved.