Duda con el avatar con pestañas

Jue Dic 22, 2016 3:34 am

Bien es lo que estaba intentando hacer en mi foro, poner un avatar con pestañas pero cada vez que lo intentaba el avatar hacia lo que le daba la real gaana y despues el problema de no saber meter los datos en la seccion adecuada

He encontrado algo parecido en el foro de MasterCat lo que hubiera querido en mi foro hubiera sido algo como esto, el template que tenía era esto Template

Lo que desearia:

Bien el css que tenía era el siguiente

Spoiler:

*Ahi añadiria la pestaña 5

Spoiler:

Agregaria las medallas y alguna cosa más

Javas

Perfil 1:

Perfil 2:

PEstaña 4:

PEstaña 5:

Inventario:

El tutorial que he intentado seguir es el siguiente: http://pastebin.com/ZpdQr0Br

Con la unica diferencia es que el rango del personaje iria en el exterior y no dentro, pero vamos ya es por curiosidad

Claro intentado dejar esto https://i.imgur.com/4aH8R6d.png (Solo esa parte)

Demasiadas cosas estoy pidiendo yo Duda con el avatar con pestañas 3806464160

Jue Dic 22, 2016 12:10 pm

Hola Scyhaz, creo que este tutorial del foro de asistencia de Foroactivo podría ayudarte para lo que buscas, yo una vez lo probé y me pareció interesante, además de que esta muy bien explicado. Espero que te sirva! Duda con el avatar con pestañas 2333082189

Jue Dic 22, 2016 5:48 pm

Lo he intentado pero como que me suena a chino (no se pasar los datos a sus respectivos lugares)

Jue Dic 22, 2016 6:26 pm

Buenas again, Scy! Ahora bien, para ayudarte con tu duda, sería conveniente que nos indicaras en qué paso de ese tutorial te trabaste, qué intentaste hasta el momento y qué es lo que no te ha funcionado o incluso capturas de pantalla de los errores.

Nosotras siempre vamos a intentar ayudarles, guiarles hasta la meta

pero no vamos a diseñarles todo de cero; eso recae en ustedes Duda con el avatar con pestañas 202880118

Dom Dic 25, 2016 5:05 am

Bien lo estoy intentando con el tutorial que me habeis sugerido, por intentarlo no se pierde nada, lo que me lia mas es esta zona

Código:: /* moveToTab.push([Índice_de_la_tab_de_DESTINO, "Título_del_campo_del_perfil_a_mover"]); */

Es decir, como paso lo de las medallas, por ejemplo

Dom Dic 25, 2016 5:21 pm

¿Cómo "pasás lo de las medallas"? No comprendo bien tu pregunta Duda con el avatar con pestañas 3736116548

El pedazo de código a editar sería:

Código:: /* moveToTab.push([Índice_de_la_tab_de_DESTINO, "Título_del_campo_del_perfil_a_mover"]); */ moveToTab.push([4, "comentarios"]); moveToTab.push([5, "medallas"]);

Lo que está entre /* estas cositas así */ son las indicaciones.

Así, supongamos que tenés 6 pestañas, y que querés que en la sexta pestaña aparezca el campo de, no sé, "humor", vos tendrías que poner:

Código:: /* moveToTab.push([Índice_de_la_tab_de_DESTINO, "Título_del_campo_del_perfil_a_mover"]); */ moveToTab.push([4, "comentarios"]); moveToTab.push([5, "medallas"]); moveToTab.push([6, "humor"]);

Nunca usé el tutorial, pero te digo lo que yo leo y entiendo de ello (?).

Lun Dic 26, 2016 3:37 am

Por ejemplo

Código:: /*** Código implementado por Sr.Smith para el foro hispano de asistencia de Foroactivo ***/ /*** No se autoriza la utilización y/o distribución de este código sin el permiso expreso de su autor ***/ /*** Version 1.00 ***/ (function() { $(function() { var w = parseInt($('.postprofile').css('width')); var moveToTab = []; /*********** ZNOA EDITABLE ********/ var removeHr = true; /* true -ó- false -->Para indicar si queremos conservar las líneas de separación entre entre los campos */ /* var tabTitles=["Título_de_la_tab/botón 1","Título_de_la_tab/botón 2","Título_de_la_tab/botón 3","Título_de_la_tab/botón N"]; */ var tabTitles = ["Avatar", "Info", "Contacto", "Commentarios", "Medallas","Familia", "Misiones", "Bolsa",]; /* moveToTab.push([Índice_de_la_tab_de_DESTINO, "Título_del_campo_del_perfil_a_mover",]); */ moveToTab.push([4, "comentarios"]); moveToTab.push([5, "medallas"]); moveToTab.push([6, "familia"]); moveToTab.push([7, "misiones"]); moveToTab.push([8, "bolsa"]); /*moveToTab.push(["profile_field_13_9","profile_field_13_6","profile_field_13_10","profile_field_13_5","profile_field_13_8","profile_field_13_8"]);*/ /******** FIN ZONA EDITABLE ********/ var tt = '<center><ul class="profile-buttons">'; for (var i = 0; i < tabTitles.length; i++) { if ((i + 1) == 1) { tt += '<li id="ppb' + (i + 1) + '" class="active">' + tabTitles[i] + '</li>'; } else { tt += '<li id="ppb' + (i + 1) + '">' + tabTitles[i] + '</li>'; } } tt += '</ul></center>'; var nt = ""; for (var i = 3; i < tabTitles.length; i++) { nt += '<div id="prof_d' + (i + 1) + '" class="prof_nocont" style="display:none;width:' + (w * 2) + 'px; margin-left:' + (w * 2) + 'px;"></div>' } $('.postprofile').each(function() { $(this).prepend(tt); $(this).find('dt').wrap('<div id="prof_d1" class="prof_cont" style="display:block">'); $(this).find('dd:not(:last)').wrapAll('<div id="prof_d2" class="prof_nocont" style="display:none;width:' + (w * 2) + 'px; margin-left:' + (w * 2) + 'px;">'); $(this).find('dd:last').wrap('<div id="prof_d3" class="prof_nocont" style="display:none;width:' + (w * 2) + 'px; margin-left:' + (w * 2) + 'px;">'); $(this).find('dl').append(nt); if ($(this).css('float') === "left") $(this).find('.prof_nocont').css('margin-left', (-(w * 2) + 'px')); $(this).find('.profile-buttons li').click(function() { if ($(this).attr('class') != "active") { $(this).addClass('active'); $(this).siblings().removeClass('active'); var indd = $(this).attr('id').match(/\d+/)[0]; $(this).closest('.postprofile').find('.prof_cont').attr('class', 'prof_nocont'); $(this).closest('.postprofile').find('#prof_d' + indd).attr('class', 'prof_cont'); $(this).closest('.postprofile').find('dl').prepend($(this).closest('.postprofile').find('#prof_d' + indd)); if ($('.postbody').css('float') === "left") { $(this).closest('.postprofile').find('.prof_nocont').animate({ "margin-left": ((w * 2) + 'px'), "width": (w * 2) + 'px' }, 1000, function() { $(this).hide() }); $(this).closest('.postprofile').find('#prof_d' + indd).show().animate({ "margin-left": 0, "width": w + 'px' }, 1000); } else { $(this).closest('.postprofile').find('.prof_nocont').animate({ "margin-left": (-(w * 2) + 'px'), "width": (w * 2) + 'px' }, 1000, function() { $(this).hide() }); $(this).closest('.postprofile').find('#prof_d' + indd).show().animate({ "margin-left": 0, "width": w + 'px' }, 1000); } } }); }); function clean(text) { var text = text.toLowerCase(); text = text.replace(/[áàäâå]/gi, 'a'); text = text.replace(/[éèëê]/gi, 'e'); text = text.replace(/[íìïî]/gi, 'i'); text = text.replace(/[óòöô]/gi, 'o'); text = text.replace(/[úùüû]/gi, 'u'); text = text.replace(/[ýÿ]/gi, 'y'); text = text.replace(/[ñ]/gi, 'n'); text = text.replace(/[ç]/gi, 'c'); text = text.replace(/['"]/, ''); text = text.replace(/\s+/g, '-'); text = text.replace(/[^a-zA-Z0-9-]/g, ''); return text; } $('.postprofile span.label').each(function() { $(this).wrap('<div class="pprof_camp">').parent().addClass(clean($(this).find('span').text())); $(this).wrap('<div class="pprof_label">'); }); $('.postprofile').each(function() { if ($(this).find('.pprof_camp:first').length) { var j = $(this).find('.pprof_camp:first').parent().html().split('</div></div>'); var jj = j.join('</div><div class="dato">').replace(/\<hr\>\<div/gi, '</div><hr></div><div').replace(/\<\/span\>\<div/gi, '</span></div><div'); $(this).find('.pprof_camp:first').parent().html(jj) + '</div><hr></div>'; for (ii in moveToTab) { if ($('#prof_d' + moveToTab[ii][0]).length && $('.pprof_camp.' + moveToTab[ii][1]).length) $(this).find('.pprof_camp.' + moveToTab[ii][1]).prependTo($(this).find('#prof_d' + moveToTab[ii][0])) } } }); if (removeHr == true) $('.postprofile').find('hr').replaceWith('<br>'); }) })();

La parte de la bolsa, lo he puesto asi pero no me lo reconoce no me aparece nada de nada, lo que quiero decir ¿como paso dicha informacion?

Lun Dic 26, 2016 7:16 pm

Hola Scyhaz, bueno respondiendo tu duda, volví a seguir el tutorial del foro de asistencia de foroactivo y me salió bien, así que te invito a volver a intentarlo al pie de la letra. Cito parte de lo que ellos escribieron allá donde mencionan lo que te interesa que son las medallas:

Después de instalar este tuto llegaremos a tener 5 botoncitos con los que llegar/mostrar por separado: el avatar, la información del usuarios, la campos/imágenes de contacto, el campo de comentario (lo acorté para no hacer más largo el postprofile, pero puede tener el tamaño máximo que se admite para los campos) y, por último, una tab para las medallas.

Si tienes problemas con el reconocimiento del javascript quizás es porque no cambiaste la url apropiadamente, me explico, a veces al instalar un javascript en foroactivo en el panel para añadir javascript, estos se guardan y se activan automaticamente en el foro, pero hay algunos que no sé porque motivo no los lee, por lo que hay que "volver" a ponerlos en el template de la siguiente forma:

Código:: <script src="tuforo/nombredetujava.js"></script>

Si pusiste el java 2 o tres veces en diferentes lugares, igual eso podría generarte que no lo lea apropiadamente, te recomiendo que lo borres todo y vuelvas a empezar desde cero.

PD. Si no quieres perder el código que hiciste antes puedes guardarlo en tu pc en el bloc de notas ;D

Próx

Bridgerton

Luz vs Oscuridad

Paraíso Personal

Amor y Amistad

Conejo de Pascua

Duda con el avatar con pestañas

Cambia colores, fonts y mucho más. BBcode permitido.

Cambia colores, fonts y mucho más. BBcode permitido.

Cambia colores, fonts y mucho más. BBcode permitido.

Cambia colores, fonts y mucho más. BBcode permitido.

TELL ME EVERYTHING

TELL ME EVERYTHING

Cambia colores, fonts y mucho más. BBcode permitido.

Cambia colores, fonts y mucho más. BBcode permitido.

TELL ME EVERYTHING

TELL ME EVERYTHING

Cambia colores, fonts y mucho más. BBcode permitido.

Cambia colores, fonts y mucho más. BBcode permitido.