Как создать Drupal 7 & Colorbox на оверлее загрузки страницы? - PullRequest
Новая
       32

Как создать Drupal 7 & Colorbox на оверлее загрузки страницы?

1 голос
/ 01 ноября 2011

Я пытаюсь создать наложение при загрузке страницы, используя Drupal 7 & Colorbox, и я в тупике. Мои навыки в JS / JQuery довольно слабые, и я преодолел барьер. Я создал блок в представлениях и перенес его на свою домашнюю страницу. Я добавил класс .colorbox вручную в свой файл tpl.php, который позволяет добавлять остальные определенные классы colorbox. вот код для моего блока: 

<section id="block-views-hp-overlay-hp-overlay-block" class="block block-views colorbox init-colorbox-processed-processed cboxElement" style="display:none;">

вот мой Drupalized файл jQuery: 

/* overlay */
(function ($) {

Drupal.behaviors.initColorboxHP = {
  attach: function (context, settings) {
    if (!$.isFunction($.colorbox)) {
      return;
    }
    $('#block-views-hp-overlay-hp-overlay-block', context)
      .filter('.colorbox')
      .once('init-colorbox-processed')
      .colorbox({inline:true,href:"#block-views-hp-overlay-hp-overlay-block",innerWidth:"600px", innerHeight:"600px"});
  }
};

{
  $(document).bind('cbox_complete', function () {
    Drupal.attachBehaviors('#cboxLoadedContent');
  });
}

})(jQuery);

Я ожидал, что блок будет скрыт с помощью встроенного определения стиля. Тогда мой colorbox / jquery поднял бы его и показал в хорошем наложении. Похоже, что обработчик событий не вызывается, но я не уверен, что делать дальше, поэтому любые рекомендации будут высоко оценены. Я вижу, что некоторые другие люди получили эту работу в не-Drupal контекстах, но мне трудно воссоздать.

Я использовал эти ресурсы, чтобы зайти так далеко ...

http://drupal.org/node/863858

http://jacklmoore.com/colorbox/faq/#faq-cookie

Ответы [ 2 ]

1 голос
/ 01 ноября 2011

Я не знаком с Drupal, но, возможно, вам просто нужно добавить свойство open к параметрам colorbox: 

{inline:true,href:"#block-views-hp-overlay-hp-overlay-block",innerWidth:"600px", innerHeight:"600px", open:true}

Я не уверен в вашей ситуации, новам, вероятно, не нужно прикреплять colorbox к элементу (вы планируете, чтобы он был кликабельным, чтобы вы могли открыть его во второй раз?).Если нет, просто позвоните в colorbox напрямую.Заменить это: 

$('#block-views-hp-overlay-hp-overlay-block', context)
  .filter('.colorbox')
  .once('init-colorbox-processed')
  .colorbox({inline:true,href:"#block-views-hp-overlay-hp-overlay-block",innerWidth:"600px", innerHeight:"600px"});

На это: 

    $.colorbox({inline:true,href:"#block-views-hp-overlay-hp-overlay-block",innerWidth:"600px", innerHeight:"600px"});
0 голосов
/ 01 ноября 2011

Спасибо за помощь @Джек, которая привела меня туда (вроде ...), вот что я сделал.Во-первых, в качестве упражнения я выбросил материал с друпалами (б / у знал, что я могу обмануть и получить свой сценарий без особых вещей с друпалом. Затем я сделал это: 

jQuery(document).ready(function($) {
$('#block-views-hp-overlay-hp-overlay-block').show();
$.fn.colorbox({inline:true,href:"#block-views-hp-overlay-hp-overlay-block",innerWidth:"600px", innerHeight:"600px",open:true});

 $(document).bind('cbox_closed', function(){
            $('#block-views-hp-overlay-hp-overlay-block').hide();
    });

});

Что по сутидля чего я собираюсь. Я уверен, что есть более элегантный и правильный подход к Drupal, поэтому я опубликую это, когда выясню это ...

...