添加表格& lightbox.js中的HTML to Lightbox.prototype

时间:2013-05-29 17:36:25

标签: php javascript facebook lightbox colorbox

我需要像Facebook一样构建代码。我在谈论他们使用的“pop”或Lightbox,所以在右侧你可以评论,在这种情况下我会发送一封电子邮件,并在底部插入一个随机图像。

我也在使用colorbox,但是我使用内联html,如果用户想要从上一张到下一张图片,我将会非常迷失,因为我不知道如何在Colorbox中执行此操作(包括表单而不仅仅是图片),

无论如何,所有图片的联系表格都是相同的。每个用户将有8张图片和1张联系表格,已经完成。我需要制作或构建一个类似Facebook使用的灯箱。

这就是为什么我在lightbox.js(我的另一个选项)里面找到HTML形成它的部分:

 Lightbox.prototype.build = function() {
      var $lightbox,
        _this = this;
      $("<div>", {
        id: 'lightboxOverlay'
      }).after($('<div/>', {
        id: 'lightbox'
      }).append($('<div/>', {
        "class": 'lb-outerContainer'
      }).append($('<div/>', {
        "class": 'lb-container'
      }).append($('<img/>', {
        "class": 'lb-image'
      }), $('<div/>', {
        "class": 'lb-nav'
      }).append($('<a/>', {
        "class": 'lb-prev'
      }), $('<a/>', {
        "class": 'lb-next'
      })), $('<div/>', {
        "class": 'lb-loader'
      }).append($('<a/>', {
        "class": 'lb-cancel'
      }).append($('<img/>', {
        src: this.options.fileLoadingImage
      }))))), $('<div/>', {
        "class": 'lb-dataContainer'
      }).append($('<div/>', {
        "class": 'lb-data'
      }).append($('<div/>', {
        "class": 'lb-details'
      }).append($('<span/>', {
        "class": 'lb-caption'
      }), $('<span/>', {
        "class": 'lb-number'
      })), $('<div/>', {
        "class": 'lb-closeContainer'
      }).append($('<a/>', {
        "class": 'lb-close'
      }).append($('<img/>', {
        src: this.options.fileCloseImage
      }))))))).appendTo($('body'));
      $('#lightboxOverlay').hide().on('click', function(e) {
        _this.end();
        return false;
      });
      $lightbox = $('#lightbox');
      $lightbox.hide().on('click', function(e) {
        if ($(e.target).attr('id') === 'lightbox') _this.end();
        return false;
      });
      $lightbox.find('.lb-outerContainer').on('click', function(e) {
        if ($(e.target).attr('id') === 'lightbox') _this.end();
        return false;
      });
      $lightbox.find('.lb-prev').on('click', function(e) {
        _this.changeImage(_this.currentImageIndex - 1);
        return false;
      });
      $lightbox.find('.lb-next').on('click', function(e) {
        _this.changeImage(_this.currentImageIndex + 1);
        return false;
      });
      $lightbox.find('.lb-loader, .lb-close').on('click', function(e) {
        _this.end();
        return false;
      });
    };

我的问题是,我可以在HTML中插入表单吗?我想我可以。
但我可以使用PHP包括插入随机图像等功能吗?

你将用什么来实现这样的目标?你知道一个我可以作为参考的例子吗?我真的已经阅读了文档和很多东西,比如Colorbox和Lightbox等主要内容,它也必须与Jquery兼容。

编辑:WOOOOW !! :看看我在jquerytools下找到了什么。 http://jquerytools.org/demos/combine/html5-form/index.html

如果这与Internet Explorer 6及更高版本兼容,我有一个胜利者。

0 个答案:

没有答案