Ver Mensaje Individual
  #4 (permalink)  
Antiguo 13/06/2012, 13:26
Puzzle
 
Fecha de Ingreso: junio-2012
Ubicación: Barcelona
Mensajes: 4
Antigüedad: 12 años, 5 meses
Puntos: 0
Respuesta: Ventana flotante con video que no se centra

Lamentablemente no me ha funcionado la respuesta de @sjj, al modificar alguna de esas dos opciones lo que hace es directamente anular esa alineación.

(Temporalmente) copio el resto del código por si alguien puede ayudarme.
Código Javascript:
Ver original
  1. jQuery.fn.videopopup = function (options) {
  2.     var settings = {
  3.         videoid: "",
  4.         videoplayer: "youtube",
  5.         width: "960px",
  6.         height: "540px",
  7.         autoplay: "false"
  8.     };
  9.     return this.each(function () {
  10.         if (options) {
  11.             $.extend(settings, options)
  12.         }
  13.         function centerS(cur) {
  14.             var cur = cur;
  15.             cur.css("position", "absolute");
  16.             cur.css("top", ($(window).height() - cur.height()) / 2 + $(window).scrollTop() + "px");
  17.             cur.css("left", ($(window).width() - cur.width()) / 2 + $(window).scrollLeft() + "px");
  18.             return this
  19.         }
  20.  
  21.         $(this).click(function (e) {
  22.             var a = $(document).height();
  23.             var b = $(window).width();
  24.             e.preventDefault();
  25.             var popuphtml = '<div id="dvGlobalMask"></div><div id="videopopup"><div class="modalnav"></div><div id="videocontent"></div></div>';
  26.             $("body").append(popuphtml);
  27.             $("#dvGlobalMask").css({
  28.                 width: b,
  29.                 height: a
  30.             });
  31.             $("#dvGlobalMask").fadeTo("fast", 0.4);
  32.             $("#videopopup").css("width", settings.width);
  33.             $("#videopopup").css("height", settings.height);
  34.             centerS($("#videopopup"));
  35.             var autoplay = 0;
  36.             if (settings.autoplay == "true") {
  37.                 autoplay = 1
  38.             } else {
  39.                 autoplay = 0
  40.             }
  41.             youtubestr = '<iframe width="' + settings.width + '" height="' + settings.height + '" src="http://www.youtube.com/embed/' + settings.videoid + "?autoplay=" + autoplay + '&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>';
  42.             vimeostr = '<iframe src="http://player.vimeo.com/video/' + settings.videoid + "?color=008093&amp;show_title=0&amp;show_portrait=0&amp;autoplay=" + autoplay + '" width="' + settings.width + '" height="' + settings.height + '" frameborder="0"></iframe>';
  43.             switch (settings.videoplayer) {
  44.             case "youtube":
  45.                 $("#videocontent").html($(youtubestr));
  46.                 break;
  47.             case "vimeo":
  48.                 $("#videocontent").html($(vimeostr));
  49.                 break
  50.             }
  51.             $("#videopopup").show();
  52.             $(".modalnav").show()
  53.         });
  54.         $(".modalnav").live("click", function () {
  55.             $("#dvGlobalMask").hide();
  56.             $("#videopopup").hide();
  57.             $(".modalnav").hide();
  58.             $('#videocontent').html('');
  59.             $(settings.videoid).hide()
  60.         })
  61.     });
  62.     return this
  63. };
Código CSS:
Ver original
  1. #dvGlobalMask {
  2.     position: absolute;
  3.     top: 0;
  4.     left: 0;
  5.     width: 100%;
  6.     z-index: 1100;
  7.     background-color:#3F3F3F;
  8. }
  9.  
  10. #videopopup {
  11.     background: none repeat scroll 0 0 #FFFFFF;
  12.     box-shadow: 5px 5px 20px #000000;
  13.     display: none;
  14.     padding-bottom: 5px;
  15.     position: absolute;
  16.     z-index: 9001;
  17.     border: 15px solid #fff;
  18.     position:relative;
  19. }
  20.  
  21. .modalnav {
  22.     cursor: pointer;
  23.     height: 30px;
  24.     width: 30px;
  25.     position:absolute;
  26.     right:-25px;
  27.     top:-25px;
  28.     background: url("../images/modal-nav-hover.png") -40px 0px;
  29. }
  30.  
  31. .modalnav:hover {
  32.     background: url("../images/modal-nav-hover.png") -40px 0px;
Sigo creyendo que quizá lo que hace es chocar con alguna otra parte del código de la web, pero no sé qué puede ser. A ver si a alguien se le ocurre qué puede ser y podemos solucionarlo.

Lo agradecería mucho.

Un saludo.