Artículos recomendados al azar en ventana emergente y con opción de cerrar

Ventana emergente en el pie de página (derecha), con opción de cerrar, configurable para que aparezca y desaparezca con efecto desvanecimie...

Ventana emergente

Ventana emergente en el pie de página (derecha), con opción de cerrar, configurable para que aparezca y desaparezca con efecto desvanecimiento al llegar a una altura que hemos configurado anteriormente. También he añadido para que, con menos de 995px.(Responsive Web Design) no salga la ventana.

Comencemos:

Entra en la plantilla, busca ]]></b:skin> (Control+F), y arriba de ello copia y pega estos estilos (CSS):

#v_emergente {
position: fixed;
font: 14px Arial; /* Tamaño del texto de los artículos*/
display: none;
padding: 3px 52px 18px 5px;
text-align: left;
z-index: 999;
text-shadow: 0 1px 1px #eee;
border: #9dceff solid 1px; /* Color del contorno de la ventana*/
max-width: 300px; /* Ancho máximo de la ventana */
background: #fafafa; /* Color del fondo de la ventana */
bottom: 0;
right: 0;
}
#v_emergente :hover {
color: #333 !important; /* Color del texto al pasar el mouse sobre el */
}
#separador_reco {
margin-top: -10px;
margin-bottom: -12px;
}
#cerrar_estilo {
position: fixed;
border: #e6e6e6 solid 1px; /* Color del contorno del botón de cerrar */
padding: 0 2px 0 2px;
border-radius: 3px;
display: none;
font: 12px Arial; /* Tamaño del texto del botón de cerrar */
right: 5px;
bottom: 5px;
cursor: pointer;
z-index: 9999;
}
#cerrar_estilo:hover {
color: #333 !important; /* Color del texto de el botón de cerrar al pasar el mouse sobre el */
border: #333 solid 1px; /* Color del contorno del botón de cerrar al pasar el mouse sobre el */
}
@media screen and (max-width:995px) {
#v_emergente, #cerrar_estilo {
display: none !important;
}
}

Ahora busca </head>, encima de ello copia y pega este script:

<script type='text/javaScript'>
//<![CDATA[
(function(a){a(window).scroll(function(){if(a(this).scrollTop()>500){a("#v_emergente, #cerrar_estilo").removeAttr("href");a("#v_emergente, #cerrar_estilo").fadeIn(1500)}else{a("#v_emergente, #cerrar_estilo").fadeOut(1500)}});a(function(){a("#v_emergente, #cerrar_estilo")})})(jQuery);
//]]>
</script>

Y por último encima de: </body>, copia y pega estos últimos scripts:

<div id='cerrar'>
<div id='recomendado'>
<span style='color: #333; font: bold 15px Times; text-shadow: 0 1px 1px #ccc;'>Recomendados para ti:</span>
<div id='separador_reco'><img alt='tis' src='//lh3.googleusercontent.com/-2fYnepCTHis/VFpp_4p9bhI/AAAAAAAAHC0/ZP6txJsbD6E/s320/separador.jpg'/></div>
<script type='text/javaScript'>
//<![CDATA[
var numposts=2;
var current=[];var total_posts=0;var current=new Array(numposts);function totalposts(json){total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<numposts;i++){var found=false;var rndValue=random();for(var j=0;j<current.length;j++){if(current[j]==rndValue){found=true;break}};if(found){i--}else{current[i]=rndValue}}};function random(){var ranNum=1+Math.round(Math.random()*(total_posts-1));return ranNum};
//]]></script>
<!-- http://www.teinteresasaber.com -->
<script type='text/javaScript'>
//<![CDATA[
function random_posts(json){a=location.href;y=a.indexOf('?m=0');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;if('content'in entry){var snippet=entry.content.$t}else{if('summary'in entry){var snippet=entry.summary.$t}};snippet.replace(/<[^>]*>/g,"");{snippet}for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=='alternate'){var posturl=entry.link[j].href;if(y!=-1){posturl=posturl+'?m=0'}var postdate=entry.published.$t;if('media$thumbnail'in entry){var thumb=entry.media$thumbnail.url}}};document.write('');document.write('<br><a href="'+posturl+'"rel="nofollow">• '+posttitle+'</a><br>');document.write('<div style="clear:both"></div>')}};getvalue();for(var i=0;i<numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+current[i]+'&max-results=1&callback=random_posts\"><\/script>')};eval(function(p,a,c,k,e,r){e=String;if(!''.replace(/^/,String)){while(c--)r[c]=k[c]||c;k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('2 0(){1=3.4("0");1.5.6="7"}(0);',8,8,'cerrar|div|function|document|getElementById|style|display|none'.split('|'),0,{}))
//]]></script></div><a href='javascript:cerrar()'><div id='cerrar_estilo'>Cerrar</div></a></div>

Si quieres modificar a tu gusto y cambiar los colores puedes hacerlo modificando los códigos marcados en azul (tabla de colores).


Fuente: Pedro PC

Comentarios

BLOGGER

Relacionados:




Aviso: En algunos artículos se irá añadiendo texto y/o vídeos según creamos conveniente, para una mayor ilustración de los mismos.

• Si encuentras un error de sintaxis, redacción u ortográfico en el artículo, vídeos que dejaron de funcionar, etc... háznoslo saber a través de contáctanos. ¡Muchas gracias!

Vídeos recomendados:


Ayrton Senna, una muerte a 320 kilómetros por hora

Enlace: Ayrton Senna, una muerte...

Alejandro III Rey de macedonia más conocido como Alejandro Magno

Enlace: Alejandro III Rey de macedonia...
Nombre

2012,9,3 dimensiones,6,A. Edison,2,A.Turing,2,Abducción,2,Abejas,3,AC-DC,3,Adán y Eva,2,ADN,2,Agua,65,Águilas,4,Air Force One,2,Ajedrez,2,Al Capone,2,Alimentación,40,Alquimia,4,Amor,47,Amuleto/Talismán,2,Anarquismo,2,Ángeles,6,Animales,143,Anonymous,3,Antártida,2,Apocalipsis,3,Apple,7,Arañas,4,Argentina,12,Armagedón,2,Armas,18,Artes marciales,7,Asteroides,13,Atlántida,3,Audio,42,Audio libros,23,Aviones,46,Ballenas,2,Banderas,6,Barbie,3,Barcos,22,Beatles,8,Bebidas,30,Biblia,16,Bicicletas,8,Big Bang,5,Bluetooth,2,Boxeo,3,Britney Spears,2,Brujería,4,Burgos,38,C. Colón,4,Caballos,4,Café,3,Calculadoras,3,Calendario,11,Camiones,3,Cáncer,5,Cárceles,3,Casino,2,Castillos,8,Castrati,2,Cern,4,Cerveza,5,Charlot,3,Chat,3,Che,3,China,24,Ciencia,297,Cine,100,Circo,5,Citröen,3,Clima,21,Clima (Burgos) - Horario mundial,1,Coca cola,2,Códice,4,Código,10,Código abierto,5,Cometas,6,Cómic,7,Concorde,2,Continentes,4,Copla,2,Cuba,3,Cuerpo de élite,3,Cuerpo humano,101,Culturas urbanas,3,Curiosidades,1037,Curiosity Rover,1,Da Vinci,6,Delfines,3,Delorean DMC - 12,2,Deportes,50,Día D,1,Diablo,9,Dibujos,34,Discos,4,Disney,17,Documentales,254,Doodle,2,Dragones,2,Drogas,6,Drones,2,Ébola,2,Eclipses,3,Edad Media,9,EE.UU.,106,Egipto,26,Einstein,3,El Cid,5,El Jarabo,2,El Lute,1,Elvis,3,En directo,5,Energía,48,Enfermedad,40,Enseñanza,175,Esclavitud,2,Escorpiones,2,Espadas,2,España y Pueblos,227,Estrellas,12,Exorcismo,6,Fantasmas,8,Ferrari,5,Física,33,Flamenco,2,Fobias,3,Ford,3,Formula 1,2,Fotografía,26,Francia,10,Franco,11,Francotiradores,3,Frases/Dichos,10,Freddie Mercury,3,Fuego,9,Fútbol,23,Galileo,4,Gandhi,2,Gastronomía,5,Gigantismo,3,Gitanos,5,Gliese 832,2,Google,17,GPS,3,Groucho Marx,2,Guerra,74,Guinness,8,Guitarras,5,H.Davidson,2,Hackers,14,Halloween,3,Hilo rojo,2,Hippie,2,Historia,625,Hitler,14,Homosexualidad,3,Humor,57,Idiomas,7,Imprenta,4,Indígenas,4,Indios,5,Informática,112,Insectos,10,Internet,66,Inventos,177,Invidente,5,Italia,14,Jabón,3,Jackson,9,Japón,19,Jesucristo,12,John Lennon,3,Juegos,31,Juegos en línea,24,Juegos olímpicos,5,Juguete,9,Kennedy,2,Lady Di,2,Las fuerzas del planeta (Serie),5,Láser,3,Leyendas,102,Libros,32,Lotería,2,Luis Lucena,2,Luna,19,Mafia,7,Magia,10,Magnetismo,16,Máquina del tiempo,2,Maradona,4,Maratón,2,Marie Curie,2,Marilyn Monroe,3,Mayas,8,McDonald's,3,Medidor,1,México,26,Mi pedazo de cielo,1,Mike Tyson,2,Misterio,238,Mitologías,2,Moda,11,Mona Lisa,2,Monarca,4,Monedas,8,Monopoly,2,Mosquitos,2,Motor,63,Motor de agua,2,Motos,8,Mozart,2,Museo,7,Música,132,Napoleón,2,Nasa,12,Navarra,4,Navidad,28,Nintendo,4,Nostradamus,3,Noticias,250,Notre Dame,2,Nuclear,16,Obesidad,3,Ouija,2,Ovnis,30,Pamplona,2,Papa,6,Papá Noel,2,Pegamento,2,Pendrive,3,Península Ibérica,2,Perfumes,2,Perros,17,Personas,459,Petróleo,2,Piedras preciosas,2,Pinocho,2,Pintura,14,Pirámides,4,Piratas,6,Pirotecnia,3,Plantas,24,Pokémon Go,2,Polígrafo,2,Poltergeist,2,Profecías,9,Psicofonía,2,Queen,4,Quijote,2,Química,8,Radio,14,Ranas,2,Recordando a,190,Reencarnación,3,Reggae,2,Religión,130,Relojes,16,Resaca,2,Reyes magos,5,Rock,7,Roma,32,Rosetta,2,Rusia,24,Sabías que,1638,Salud,158,San Valentín,2,Seducción,3,Semana Santa,4,SETI,3,Shakira,2,SIDA,6,Simpson,3,Sistema solar,14,Sol,35,Spam,3,Submarino,4,Sucesos,64,Sueños,20,Sugerencias,35,Symbian,33,Tabaco,3,Tatuajes,5,Tecnología,274,Ted Williams,2,Telefonía,59,Telescopios,5,Televisión,18,Templarios,3,Teresa de Calcuta,2,Terremotos,12,Test,4,Tetris,2,Tiburones,11,Tierra,110,Titanic,11,Toros,5,Torre Eiffel,2,Torres gemelas,2,Trenes,11,Triángulo de las Bermudas,4,Trucos,4,Tutankamón,4,Tutorial,13,Universo,117,Vacunas,3,Varios,94,Vídeo,656,Videojuegos,5,Vino,2,Virus,6,Virus informáticos,15,Vril,2,Whisky,2,Windows,6,YouTube,6,Zodiaco,4,Zombis,3,
ltr
item
Te interesa saber: Artículos recomendados al azar en ventana emergente y con opción de cerrar
Artículos recomendados al azar en ventana emergente y con opción de cerrar
http://3.bp.blogspot.com/-7RLWwoifYZY/VQ8f2r8eEUI/AAAAAAAAIlE/02w6MMVHJ4g/s1600/recomendados-al-azar.jpg
http://3.bp.blogspot.com/-7RLWwoifYZY/VQ8f2r8eEUI/AAAAAAAAIlE/02w6MMVHJ4g/s72-c/recomendados-al-azar.jpg
Te interesa saber
http://www.teinteresasaber.com/2015/03/articulos-recomendados-al-azar-en.html
http://www.teinteresasaber.com/
http://www.teinteresasaber.com/
http://www.teinteresasaber.com/2015/03/articulos-recomendados-al-azar-en.html
true
637010643059257927
UTF-8
Cargar todos los artículos No se ha encontrado Ver todo Seguir leyendo... Responder Cancelar respuesta Borrar Por Inicio Páginas Artículos Ver todo Recomendados para ti: Etiqueta Archivo Buscar Todos los artículos No se encontró nada con este término Volver a Inicio Domingo Lunes Martes Miércoles Jueves Viernes Sábado Domingo Lunes Martes Miércoles Jueves Viernes Sábado Enero Febrero Marzo Abril Mayo Junio Julio Agosto Septiembre Octubre Noviembre Diciembre Enero Febrero Marzo Abril Mayo Junio Julio Agosto Septiembre Octubre Noviembre Diciembre justo ahora hace 1 minuto hace $$1$$ minutos hace 1 hora hace $$1$$ horas Ayer hace $$1$$ días hace $$1$$ semanas hace más de 5 semanas Seguidores Seguir Este contenido es premium Compartir para desbloquear Copie todo el código Seleccione todo el código Todos los códigos se copiaron en el portapapeles Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy