Fancybox 3 показывает содержимое HTML несколько раз друг от друга вместо одного большого DIV с белым фоном - PullRequest
Новая
       20

Fancybox 3 показывает содержимое HTML несколько раз друг от друга вместо одного большого DIV с белым фоном

0 голосов
/ 12 июня 2019

Я создаю HTML-код в фоновом коде и возвращаю код следующим образом: 

sb.AppendLine(string.Format("<div style='float:left; margin:10px; width:115px; height:115px; padding:5px;'><img alt='{0}' src='{1}' style='width:100px; height:100px;'/></div>", altText, imageSource));

Приведенный выше код будет создавать несколько изображений, но я хочу, чтобы он отображался в одном родительском DIV Fancybox сбелый фон с кнопкой закрытия.

Я пытался добавить атрибуты ширины и высоты, но это дает каждому изображению размером 100px x 100px родительский элемент, например, 800px x 800px.

Какой атрибутмне нужно добавить, чтобы содержимое отображалось в центре страницы только в одном DIV "

enter image description here

enter image description here

var GetHTML = data;

$('.ChildLinkFancybox').on('click', function () {
  var CategoryID = $(this).attr("id");
  var UserID = "<%=CurrentUserId%>";
  var CompanyID = "<%=CompanyID%>";
  var CurrentCustomerCode = "<%=CurrentCustomerCode%>";

  if (CurrentCustomerCode == "") {
     CurrentCustomerCode = "000-000";
  }

  var APIURL = $.fn.GetBaseURL() + 'DesktopModules/DNNCommon/API/Store/GetProductsForPubCategory?CategoryId=' + CategoryID + '&UserID=' + UserID + '&CompanyID=' + CompanyID;

$.ajax({
  type: "GET",
  async: true,
  url: APIURL,
  datatype: "json",
  success: function (data) {
    var GetHTML = data;
     $.fancybox.open({                      
     type: 'html',
     content: GetHTML,
     autoSize: false,                            
     });
   },
   error: function (xhr, ajaxOptions, thrownError) {
     console.log(xhr.responseText);
   }
   });
   });

1 Ответ

0 голосов
/ 13 июня 2019

Я нашел проблему.

Контейнер ниже не будет работать, так как мне нужно добавить контейнер div вне цикла foreach в C #, а не файл View.ascx. 

<div class="MainPublishingCategoryLinkWrapper" id="mainWrapper">
    <%=GetPublishingCategoryListWithFancyBoxProducts()%>
</div>

Это правильный способдобавьте его, тогда вы должны просто установить ширину и высоту. 

sb.AppendLine("<div class='publishinglinksfancyboxwrapper'>");

    foreach (var product in simpleInfo)
    {
        //html being generated from server   
    }
sb.AppendLine("</div>");
...