Este CSS te permite mostrar un menú original, que simula un crucigrama o un código que se descifra al pasar el puntero por encima de las opciones.
domingo 21 de diciembre de 2008
Suscribirse a:
Enviar comentarios (Atom)
skip to main |
skip to sidebar
// ---------------------------------------------------
// BLOGTOC: crea una Tabla de Contenidos interactiva para Blogger.
// Beautiful Beta : http://beautifulbeta.blogspot.com : Version: 2 : 2007-04-12
// ---------------------------------------------------
// declaracion de las matrices de uso general
var postTitle = new Array(); // titulos de los posts
var postUrl = new Array(); // direcciones urls
var postDate = new Array(); // fechas
var postSum = new Array(); // sumarios
var postLabels = new Array(); // etiquetas
// declaracion de las variables de uso general
var sortBy = "titleasc"; // valor por defecto, ordenar alfabeticamente
var tocLoaded = false; // true si pueden leerse los feeds utilizando JASON
var numChars = 250; // cantidad de caracteres del sumario a mostrar en un tooltip
var postFilter = ''; // valor del filtro por defecto
// funcion callback principal
function loadtoc(json) {
function getPostData() {
// leer los datos de los posts via json-feed y guardarlos en las matrices
if ("entry" in json.feed) {
var numEntries = json.feed.entry.length;
// bucle principal que lee las entradas
for (var i = 0; i < numEntries; i++) {
// cada entrada
var entry = json.feed.entry[i];
// el titulo
var posttitle = entry.title.$t;
// la fecha
var postdate = entry.published.$t.substring(0,10);
// la direccion url
var posturl;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
// el contenido eliminando los caracteres HTML y cortandolo para crear un sumario
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
// eliminar etiquetas HTML
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
// reducir el contenido a un numero de caracteres
if (postcontent.length > numChars) {
postcontent = postcontent.substring(0,numChars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd) + '...';
}
// las etiquetas
var pll = '';
if ("category" in entry) {
for (var k = 0; k < entry.category.length; k++) {
pll += '' + entry.category[k].term + '; ';
}
var l = pll.lastIndexOf(';');
if (l != -1) { pll = pll.substring(0,l); }
}
// guardar los datos en las matrices
postTitle.push(posttitle);
postDate.push(postdate);
postUrl.push(posturl);
postSum.push(postcontent);
postLabels.push(pll);
}
}
} // final de la funcion
// inicio del script: determinar la cantidad de entradas ( numEntries = json.feed.entry.length;)
// ejecutar la funcion para extraer los datos
getPostData();
// ordenar las matrices
sortPosts(sortBy);
tocLoaded = true;
}
// funciones para filtrar y ordenar
function filterPosts(filter) {
// cambiar de filtro y mostrar la lista de posts
postFilter = filter;
displayToc(postFilter);
} // final de la funcion
function allPosts() {
// reset del filtro y mostrar la lista de posts
postFilter = '';
displayToc(postFilter);
} // final de la funcion
function sortPosts(sortBy) {
// ordenar los posts
function swapPosts(x,y) {
var temp = postTitle[x];
postTitle[x] = postTitle[y];
postTitle[y] = temp;
var temp = postDate[x];
postDate[x] = postDate[y];
postDate[y] = temp;
var temp = postUrl[x];
postUrl[x] = postUrl[y];
postUrl[y] = temp;
var temp = postSum[x];
postSum[x] = postSum[y];
postSum[y] = temp;
var temp = postLabels[x];
postLabels[x] = postLabels[y];
postLabels[y] = temp;
} // final de la funcion
for (var i=0; i < postTitle.length-1; i++) {
for (var j=i+1; j postTitle[j]) { swapPosts(i,j); } }
if (sortBy == "titledesc") { if (postTitle[i] < postTitle[j]) { swapPosts(i,j); } }
if (sortBy == "dateoldest") { if (postDate[i] > postDate[j]) { swapPosts(i,j); } }
if (sortBy == "datenewest") { if (postDate[i] < postDate[j]) { swapPosts(i,j); } }
}
}
} // final de la funcion
// mostrar la Tabla de Contenidos
function displayToc(filter) {
// crera las tres columnas de la tabla
var numDisplayed = 0;
var tocTable = '';
var tocHead1 = 'TÍTULO'; // la primera columna
var tocTool1 = 'Click para ordenar por nombre'; // texto a mostrar en el title del enlace
var tocHead2 = 'FECHA'; // la segunda columna
var tocTool2 = 'Click para ordenar por fecha'; // texto a mostrar en el title del enlace
var tocHead3 = 'ETIQUETAS'; // la tercera columna
var tocTool3 = '';
if (sortBy == "titleasc") {
tocTool1 += ' (descendente)';
tocTool2 += ' (el más nuevo primero)';
}
if (sortBy == "titledesc") {
tocTool1 += ' (ascendente)';
tocTool2 += ' (el más nuevo primero)';
}
if (sortBy == "dateoldest") {
tocTool1 += ' (ascendente)';
tocTool2 += ' (el más nuevo primero)';
}
if (sortBy == "datenewest") {
tocTool1 += ' (ascendente)';
tocTool2 += ' (el más viejo primero)';
}
if (postFilter != '') {
tocTool3 = 'Click para mostar todos los posts';
}
// crear la tabla
tocTable += '';
tocTable += '
'; // final de la tabla
// mostrar un texto indicando si son todos los posts existententes o si hay mas
if (numDisplayed == postTitle.length) {
var tocNote = 'Se muestran ' + postTitle.length + ' posts
'; } else { var tocNote = 'Se muestran ' + numDisplayed + ' posts \''; tocNote += postFilter + '\' de un total de '+ postTitle.length + '
'; } // escribir la tabla en la pagina web var tocdiv = document.getElementById("toc"); tocdiv.innerHTML = tocNote + tocTable; } // final de la funcion // permutar el orden de los titulos function toggleTitleSort() { if (sortBy == "titleasc") { sortBy = "titledesc"; } else { sortBy = "titleasc"; } sortPosts(sortBy); displayToc(postFilter); } // final de la funcion // permutar el orden de las fechas function toggleDateSort() { if (sortBy == "datenewest") { sortBy = "dateoldest"; } else { sortBy = "datenewest"; } sortPosts(sortBy); displayToc(postFilter); } // final de la funcion // permutar el enlace function showToc() { if (tocLoaded) { displayToc(postFilter); var toclink = document.getElementById("toclink"); toclink.innerHTML = 'Ocultar Indice'; } else { alert("Un momento por favor. Cargando datos... "); } // advertencia de error, la funcion todavía no se ha ejecutado } // final de la funcion function hideToc() { var tocdiv = document.getElementById("toc"); tocdiv.innerHTML = ''; var toclink = document.getElementById("toclink"); toclink.innerHTML = 'Mostrar Indice'; } // final de la funcion
| '; tocTable += '' + tocHead1 + ''; tocTable += ' | '; tocTable += ''; tocTable += '' + tocHead2 + ''; tocTable += ' | '; tocTable += ''; tocTable += '' + tocHead3 + ''; tocTable += ' | '; tocTable += '
| ' + postTitle[i] + ' | ' + postDate[i] + ' | ' + postLabels[i] + ' |
| ' + postTitle[i] + ' | ' + postDate[i] + ' | ' + postLabels[i] + ' |
'; } else { var tocNote = 'Se muestran ' + numDisplayed + ' posts \''; tocNote += postFilter + '\' de un total de '+ postTitle.length + '
'; } // escribir la tabla en la pagina web var tocdiv = document.getElementById("toc"); tocdiv.innerHTML = tocNote + tocTable; } // final de la funcion // permutar el orden de los titulos function toggleTitleSort() { if (sortBy == "titleasc") { sortBy = "titledesc"; } else { sortBy = "titleasc"; } sortPosts(sortBy); displayToc(postFilter); } // final de la funcion // permutar el orden de las fechas function toggleDateSort() { if (sortBy == "datenewest") { sortBy = "dateoldest"; } else { sortBy = "datenewest"; } sortPosts(sortBy); displayToc(postFilter); } // final de la funcion // permutar el enlace function showToc() { if (tocLoaded) { displayToc(postFilter); var toclink = document.getElementById("toclink"); toclink.innerHTML = 'Ocultar Indice'; } else { alert("Un momento por favor. Cargando datos... "); } // advertencia de error, la funcion todavía no se ha ejecutado } // final de la funcion function hideToc() { var tocdiv = document.getElementById("toc"); tocdiv.innerHTML = ''; var toclink = document.getElementById("toclink"); toclink.innerHTML = 'Mostrar Indice'; } // final de la funcion
Un blog de pruebas
| A veces nos encontramos en situaciones en las que no tenemos salida, pero ¿y si lo que no tuviéramos fueran entradas? |
wibiya widget
0 comentarios:
Publicar un comentario en la entrada