Calificación:
  • 0 voto(s) - 0 Media
  • 1
  • 2
  • 3
  • 4
  • 5
[PUBLICO] Spoiler Chromium
#1
Bombilla 
[Imagen: 141126054732499212.png]
Hola amigos aki les dejo este nuevo Spoiler Chromium publicare varios codigos/scripts tendran 3 Etiquetas Diferentes...
1.- [PUBLICO] El código fue usado/editado desde otra Pagina para traérselos.
2.- [PROPIO] Esto quiere decir que es mi Código Propio osea que yo cree el código de 0% - 100% pero podran usarlo con Respectivos Créditos.
3.- [PUBLICO/PROPIO] Esto quiere decir que el Código es Tanto como Código Mio como de otros users mas para que luego no digan que eso lo cree yo.


[Imagen: Imagenes.png]
[Imagen: screen.png]

[Imagen: screen.png]

HTML:


Código:
<div class="product">

<span class="title">Spoiler Contenido</span>

<a class="show" href="#">Mostrar</a>

<span class="homepage"><a href="http://blockpost.skn1.com/">Pagina de BlockPost!</a></span>

<div class="licence" style="display: none;">

<pre>   Notice that the following BSD-style license applies to the Valgrind header

  files used by Chromium (valgrind.h and memcheck.h). However, the rest of

  Valgrind is licensed under the terms of the GNU General Public License,

  version 2, unless otherwise indicated.



  ----------------------------------------------------------------



  Copyright (C) 2000-2008 Julian Seward.  All rights reserved.



  Redistribution and use in source and binary forms, with or without

  modification, are permitted provided that the following conditions

  are met:



  1. Redistributions of source code must retain the above copyright

     notice, this list of conditions and the following disclaimer.



  2. The origin of this software must not be misrepresented; you must

     not claim that you wrote the original software.  If you use this

     software in a product, an acknowledgment in the product

     documentation would be appreciated but is not required.



  3. Altered source versions must be plainly marked as such, and must

     not be misrepresented as being the original software.



  4. The name of the author may not be used to endorse or promote

     products derived from this software without specific prior written

     permission.



  THIS SOFTWARE IS PROVIDED BY THE AUTHOR ``AS IS'' AND ANY EXPRESS

  OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED

  WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE

  ARE DISCLAIMED.  IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY

  DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL

  DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE

  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS

  INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,

  WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING

  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS

  SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

</pre>

</div>

</div>

CSS:


Código:
.product {

 background-color:#c3d9ff;

 overflow:auto;

 padding:2px;

 margin-top:16px;

 border-radius:5px;

}

.product .title {

 font-size:110%;

 font-weight:bold;

 float:left;

 margin:3px;

}

.product .homepage {

 text-align:right;

 float:right;

 margin:3px;

}

.product .homepage::after {

 content:" - ";

}

.product .show {

 text-align:right;

 float:right;

 margin:3px;

}

.licence {

 clear:both;

 background-color:#e8eef7;

 padding:16px;

 border-radius:3px;

 display:none;

}

.licence h3 {

 margin-top:0px;

}

.licence pre {

 white-space: pre-wrap;

}

JS:


Código:
// Copyright (c) 2011 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

function $(o) {return document.getElementById(o);}

function toggle(o) {
 var licence = o.nextSibling;

 while (licence.className != 'licence') {
   if (!licence) return false;
   licence = licence.nextSibling;
 }

 if (licence.style && licence.style.display == 'block') {
   licence.style.display = 'none';
   o.innerHTML = 'Mostrar';
 } else {
   licence.style.display = 'block';
   o.innerHTML = 'Ocultar';
 }
 return false;
}

document.body.onload = function () {
 var links = document.getElementsByTagName("a");
 for (var i = 0; i < links.length; i++) {
   if (links[i].className === "show") {
     links[i].onclick = function () { return toggle(this); };
   }
 }

 $("print-link").onclick = function () {
   window.print();
   return false;
 }
};

DEMO:
[url]http://codepen.io/AngelKrak/pen/vEGJmg[/url]

[Imagen: 10-2.jpg]
Firma editada por moderación: Los enlaces con ID de referido no estan permitidos.
WWW


Posibles temas similares...
Tema Autor Respuestas Vistas Último mensaje
Bombilla [PUBLICO] Imágenes con descripción animada CSS3 AngelKrak 1 540 20-01-2015, 06:29 AM
Último mensaje: garcon
  [PUBLICO] Tutorial Botones con perspectiva 3D AngelKrak 0 299 17-01-2015, 05:44 AM
Último mensaje: AngelKrak



Usuarios navegando en este tema: 1 invitado(s)