Bueno amigos espero que les sirva de algo este nuevo truco que les traigo lo he tomado de http://ciudadblogger.com/ y lo he adaptado a jimdo es muy sencillo pero muy bueno si queremos ser detallistas con el contenido publicado en esta web bueno les traigo esto con la mejor de las intenciones espero que si lo van a colocar en su web dejen los créditos ya que ahora andan rondando un montón de ladrones que se hacen llamar web master y lo único que hacen es robar pero si ves que otra página lo tiene para jimdo y no dejó los créditos denúncialo a nitropolice disculpen por la desconfianza pero es que situaciones extremas requieren medidas extremas.
Pega los códigos donde se te indica
código de head
Pegas esto en head sin cambiarle nada
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var a = jQuery.noConflict ();
a(document).ready(function(){
a("#oscuridad").css("height", a(document).height()).hide();
a(".lightSwitcher").click(function(){
a("#oscuridad").toggle();
if (a("#oscuridad").is(":hidden"))
a(this).html("Apagar las luces").removeClass("turnedOff");
else
a(this).html("Prender las luces").addClass("turnedOff");
});
});
//]]>
</script>
<style>
/* Apagar las luces
----------------------------------------------- */
#videoLuces {
position:relative;
z-index:102;
}
#apagador {
max-width:640px;
text-align:left;
position:relative;
height:25px;
display:block;
margin: 25px 0 0 60px;
}
.lightSwitcher {
position:absolute;
z-index:101;
background-image:url(http://lh6.googleusercontent.com/-azJxijJlWX4/T3vT2giQqkI/AAAAAAAACWk/6wt4sBdcHEY/s16/luces-on.png);
background-repeat:no-repeat;
background-position:left;
padding: 0 0 0 20px;
outline:none;
text-decoration:none;
}
.lightSwitcher:hover {text-decoration:underline;}
.turnedOff {
color:#ffff00 !important;
background-image:url(http://lh4.googleusercontent.com/-J0U5xRqb7KU/T3vT2kcmUsI/AAAAAAAACWo/-VTwo42-Nj0/s16/luces-off.png);
}
#oscuridad {
background:#000;
opacity:0.7; /* Opacidad de la pantalla */
filter:alpha(opacity=70); /* Opacidad de la pantalla */
position:absolute;
left:0;
top:0;
width:100%;
z-index:100;
}
</style>
código que insertas en un nuevo widget html o donde quieras que se mire el video
<div id='oscuridad'/>
<center>
<div id="apagador"><a class="lightSwitcher" href="javascript:void(0);">Apagar las luces</a></div>
<div id="videoLuces">
...Aquí el código del video...
</div>
</div>
</center>
ejemplo de como tiene que estar tu código
<div id='oscuridad'/>
<center>
<div id="apagador"><a class="lightSwitcher" href="javascript:void(0);">Apagar las luces</a></div>
<div id="videoLuces">
<iframe width="420" height="315" src="http://www.youtube.com/embed/SncapPrTusA" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</center>
Resultado
Nota: haz click en apagar luces antes de ver el video y cuando termines de verlo haz clic en encender luces.
Escrito por: Herman orlando morales lópez
Diseño web profesional. Páginas web. Trucos para jimdo y otras plataformas. pronto mas publicaciones para tu web sobre ayudas jimdo.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Escribir comentario
nitroplantillas (lunes, 03 diciembre 2012 00:10)
dejen sus comentarios como forma de agradecimiento o si tienen alguna duda :) :) :D ;):-O :P (H) :@ :$ :S :( :'( :| (6) (A) (L) (U) (M) (@) (&) (S)
notoyontoy (martes, 11 diciembre 2012 11:17)
Muchisimas gracias por este articulo es lo que estaba buscando batalle para hacerlo yo mismo pero nadamas no daba
grcias,que tengas buen dia.
ALEXIS (martes, 08 enero 2013 15:54)
muchas gracias que mas aportes tienes para jimdo