Başlıktada belirttiğim gibi tekrar ediyim;
Lightbox veya popup mantığı ile resme tıklayınca büyümesini istiyorum bunu başarabiliyoyrum internette yeterince kaynak var fakat benim tam istediğim şu = A resime tıklayınca B resmin büyümesi gözüken bir resim mevcut olucak bu resme tıklandığında başka bir resim light box olarak açılıcak.
bu konuda elinde mevcut kaynak veya kod olan var ise yardımcı olursa sevinirim.
Kısa Açıklama
*php bir siteye uygulayacağim
*hertürlü kod bahsettiğim işlevi gerçekleştiriyor ise ekleyebilirim
*site joomla belki bildiğiniz hazır bir plugin veya modül vs de olabilir hatta daha kolay olur.
sevgiler..
--R10.NET; Flood Engellendi -->-> Yeni yazılan mesaj 01:26:35 -->-> Daha önceki mesaj 01:03:46 --
Kusura kalmayın konuyu açar açmaz yanlış arama yaptığımı fark ettim ve hemen buldum.
uyguladım tam istediğim gibi çalışıyor.
ihtiyacı olabilecek arkadaşlar için paylaşıyım.
sayfada <head> </head> arasına aşşağıdaki kodu
<link rel="stylesheet" type="text/css" media="screen" href="http://cdnjs.cloudflare.com/ajax/libs/fancybox/1.3.4/jquery.fancybox-1.3.4.css" />
<style type="text/css">
a.fancybox img {
border: none;
box-shadow: 0 1px 7px rgba(0,0,0,0.6);
-o-transform: scale(1,1); -ms-transform: scale(1,1); -moz-transform: scale(1,1); -webkit-transform: scale(1,1); transform: scale(1,1); -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;
}
a.fancybox:hover img {
position: relative; z-index: 999; -o-transform: scale(1.03,1.03); -ms-transform: scale(1.03,1.03); -moz-transform: scale(1.03,1.03); -webkit-transform: scale(1.03,1.03); transform: scale(1.03,1.03);
}
</style>yine sayfada <body> </body> arasına aşşağıdaki kodu<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/fancybox/1.3.4/jquery.fancybox-1.3.4.pack.min.js"></script>
<script type="text/javascript">
$(function($){
var addToAll = false;
var gallery = true;
var titlePosition = 'inside';
$(addToAll ? 'img' : 'img.fancybox').each(function(){
var $this = $(this);
var title = $this.attr('title');
var src = $this.attr('data-big') || $this.attr('src');
var a = $('<a href="#" class="fancybox"></a>').attr('href', src).attr('title', title);
$this.wrap(a);
});
if (gallery)
$('a.fancybox').attr('rel', 'fancyboxgallery');
$('a.fancybox').fancybox({
titlePosition: titlePosition
});
});
$.noConflict();
</script>son olarak sayfada resmi yerleştirmek istediğiniz yere bu kodu ekleyiniz<img class="fancybox" src="A resimin yolu small-image.jpg" data-big="B resimin yolu big-image.jpg" />sorunum kalmadı..