Fancybox 2 Resmin kenarına özel sütun nasıl eklenir

Bir galeri yapıyorum ve fantezi kutusu 2 ile oynamaya başladım. Oldukça güzel, sadece bir sorunum var. FancyBox'ı iki sütuna ayırmak istiyorum; biri resim için diğeri yorumlar için. Resmin sol tarafta olmasını ve doğru tarafta olmasını istiyorum.Fancybox 2 Resmin kenarına özel sütun nasıl eklenir

Önyükleme satırlarını/sütunlarını kullanmayı denedim ama işe yaramıyor gibi görünüyor. Bu denedim budur:

$(document).ready(function() { 
    $(".fancybox").fancybox({ 
    tpl: { 
     image : '<div class="container-fluid"><div class="row"><div class="col-lg-9"><img class="fancybox-image" src="{href}" alt="" /></div><div class="col-lg-3">Comments will go here</div></div></div>', 
    } 
    }); 
});

Ben de böyle sarma gibi diğer Fancybox şablon bölümleri ile oynamaya çalıştılar. Orada sütun eklemeyi denedim ama istediğimi anlamadım.

Ben de Fancybox kullanarak böyle ajax yükleme denedim

href : "test.php", 
type : 'ajax', 
ajax: { 
    type: "POST", 
    data: { 
     temp: "tada" 
    } 
},

Ve bu bir php dosyasının içeriği:

$template = ""; 
$template .= '<div class="container">'; 
$template .= '<div class="row">'; 
$template .= '<div class="col-lg-9">'; 
$template .= '<img class="fancybox-image img-responsive" src="http://image.com/theimage.jpg">'; 
$template .= '</div>'; 
$template .= '<div class="col-lg-3">'; 
$template .= 'Comments go here'; 
$template .= '</div>'; 
$template .= '</div>'; 
$template .= '<div>'; 
echo $template;

Ama bu kutuyu düzgün boyutlandırmak değil - burada ekran görüntüsü: Ben olmuştur

Bütün gün bununla oynuyor ve her yerde aradı ancak herhangi bir çözüm bulamadı.

Teşekkür

kaynak

2016-03-21 zachu

Muhtemelen belki "img-duyarlı" etiketi haricinde bu sefer özyüklenirler önleyeceğini. Bu, peşinde olduğunuza inandığım işlevselliği verecektir.

html, body{ 
 
\t \t width: 100%; 
 
\t \t height: 100%; 
 
\t } 
 
\t .fancyBox{ 
 
\t \t position: inherit; 
 
\t \t margin: auto; 
 
\t \t width: 50%; 
 
\t \t height: 50%; 
 
\t } 
 
\t .images{ 
 
\t \t float: left; 
 
\t \t height: 100%; 
 
\t \t width: 70%; 
 
\t \t background-color: green; 
 
\t } 
 
\t .comment{ 
 
\t \t float: right; 
 
\t \t height: 100%; 
 
\t \t width: 30%; 
 
\t \t background-color: red; 
 
\t }

\t <!DOCTYPE html> 
 
<html> 
 
<head> 
 

 
\t <title>Fancy Box</title> 
 

 
</head> 
 
<body> 
 
<div class="fancyBox"> 
 
\t <div class="images"> 
 
\t </div><div class="comment"></div> 
 
</div> 
 
</body> 
 
</html>

kaynak

2016-03-21 15:11:13 Rbla3066

Bu does ben fancybox penceresinde gösterilecek görüntü ve yorumlar bölümüne ihtiyaç benim için oldukça çalışma – zachu

Fancybox 2 Resmin kenarına özel sütun nasıl eklenir

cevap

İlgili konular