Foro: www.neverfall.co.cc/foro/
Versión: 1.6.1
Problema:
Hola, bien, obtuve un código jQuery que funcionaba en otro tipo de foro, pero en MyBB no funciona (El código es un poco raro xD)
Bien lo que hace el código es que al pasar el mouse sobre una imagen, en un cuadro aparezca un texto. Si entrais a mi foro, al principio hay una especie de menú interactivo con 7 opciones y debajo un cuadro.
Ejemplo: Tu pones el cursor en una imagen... El texto del cuadro cambia a otro... cuando retiras el mouse, vuelve el texto de antes.
Pero no funciona bien, el código está puesto en el index.
Los CSS y el HTML está agregado correctamente, si es necesario lo proporcionaré.
Versión: 1.6.1
Problema:
Hola, bien, obtuve un código jQuery que funcionaba en otro tipo de foro, pero en MyBB no funciona (El código es un poco raro xD)
Bien lo que hace el código es que al pasar el mouse sobre una imagen, en un cuadro aparezca un texto. Si entrais a mi foro, al principio hay una especie de menú interactivo con 7 opciones y debajo un cuadro.
Ejemplo: Tu pones el cursor en una imagen... El texto del cuadro cambia a otro... cuando retiras el mouse, vuelve el texto de antes.
Pero no funciona bien, el código está puesto en el index.
<script type="text/javascript">
jQuery(function() {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
}).mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>Los CSS y el HTML está agregado correctamente, si es necesario lo proporcionaré.
mmm, creo que es porque MyBB usa protoype...
no estoy 100% seguro, pero PRUEBA asi:
no estoy 100% seguro, pero PRUEBA asi:
<script type="text/javascript">
jQuery.noConflict();
jQuery(function() {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
}).mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
Mm hace tiempo que no te pasabas por aqui jaja
el code es así
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
}).mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
Cuando pegues un code y le salgan los quitalos! si no no te funcionará el code
el code es así
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
}).mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
Cuando pegues un code y le salgan los quitalos! si no no te funcionará el code
Última modificación: 19 Feb, 2011, 3:39 pm por alecai.
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function($) {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
}).mouseout(function($) {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
Mmm no sé normalmente suele funcionar con ése ,prueba con este haber.
y Maxii no te voy a dar repu ,por que yo no aposté contigo
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function($) {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
}).mouseout(function($) {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
Mmm no sé normalmente suele funcionar con ése ,prueba con este haber.
y Maxii no te voy a dar repu ,por que yo no aposté contigo
Hola, Sigue sin funcionar pero esta vez voy a dejar el código que tengo por si hubiera algún fallo
En las templates (header)
CSS:
Un saludo
En las templates (header)
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function($) {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
}).mouseout(function($) {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
<div class="img_list_hp"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=17"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/exposiciones.png" alt="Las <b>Exposiciones</b> ayudan a que tus nuevas creaciones sean comentadas por los miembros."><span>Exposiciones </span></a></div>
<div class="img_list_hp"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=19"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/galerias.png" alt="En las <b>Galerías</b> puedes exponer todas tus creaciones hechas a lo largo del tiempo."><span>Galerías </span></a></div>
<div class="img_list_hp"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=20"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/duelos.png" alt="Haz <b>Duelos</b> contra otros usuarios para ver quien es mejor diseñador."><span>Duelos </span></a></div>
<div class="img_list_hp"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=21"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/torneos.png" alt="Participa en los <b>Torneos</b> del foro y podrás ganar fantásticos premios."><span>Torneos </span></a></div>
<div class="img_list_hp"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=23"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/recursos.png" alt="Bájate <b>Recursos</b> para que tus creaciones sean aún más sorprendentes."><span>Recursos </span></a></div>
<div class="img_list_hp"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=25"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/tutoriales.png" alt="Mírate los <b>Tutoriales</b> del foro para aprender o mejorar en el diseño gráfico."><span>Tutoriales </span></a></div>
<div class="img_list_hp"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=27"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/evaluacion.png" alt="Haz un <b>Examen</b> para medir tu nivel de diseñador y calificar tus creaciones."><span>Evaluación </span></a></div>
<div id="arrow"><div style="clear: both" id="img_list_alt"><b>¡Toda una gama de servicios a su disposición!</b></div></div>
CSS:
.img_list_hp {
border: 1px solid #0372BE;
padding: 0;
float: left;
color: #FFF !important;
width: auto;
font-size: 11px;
text-align: center;
margin: auto 5px auto auto;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
}
.img_list_hp img:hover {
opacity: 1;
}
.img_list_hp img {
padding: 8px 15px;
opacity: 0.7;
}
.img_list_hp span {
background-color: #0372BE;
background: url(http://www.neverfall.co.cc/foro/images/pronavy/tfoot.gif) repeat-x;
color: #FFFFFF;
display: block;
padding: 2px 10px;
}
.img_list_hp a {
color: #FFF !important;
text-decoration: none;
}
#img_list_alt {
background-color: #FFF;
display: block;
padding: 5px;
-moz-border-radius: 5px 5px 5px 5px;
border: 1px solid #0372BE;
width: 740px;
text-align: center;
height: 15px;
color: #0372BE;
font-weight: bold;
}
#arrow {
clear: both;
background-image: url(http://i21.servimg.com/u/f21/11/81/27/88/arrow_10.png);
background-position: 65px 0;
background-repeat: no-repeat;
padding-left: 105px;
padding-top: 9px;
}
Un saludo
Lo que está mal si no me equivocó es el HTML
Fijate:
JS-> jQuery('.img_list_hp img').mouseover(function() {
Necesita de los dos elementos y en el HTML sale esto:
<div class="img_list_hp">
Ponlo así
<div class="img_list_hp img">
A ver si te funciona :
Dame la url de donde te sacaste ése code.
Fijate:
JS-> jQuery('.img_list_hp img').mouseover(function() {
Necesita de los dos elementos y en el HTML sale esto:
<div class="img_list_hp">
Ponlo así
<div class="img_list_hp img">
A ver si te funciona :
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
})
.mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
<div class="img_list_hp img img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=17"><img height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/exposiciones.png" alt="Las <b>Exposiciones</b> ayudan a que tus nuevas creaciones sean comentadas por los miembros."><span>Exposiciones </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=19"><img height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/galerias.png" alt="En las <b>Galerías</b> puedes exponer todas tus creaciones hechas a lo largo del tiempo."><span>Galerías </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=20"><img height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/duelos.png" alt="Haz <b>Duelos</b> contra otros usuarios para ver quien es mejor diseñador."><span>Duelos </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=21"><img height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/torneos.png" alt="Participa en los <b>Torneos</b> del foro y podrás ganar fantásticos premios."><span>Torneos </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=23"><img height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/recursos.png" alt="Bájate <b>Recursos</b> para que tus creaciones sean aún más sorprendentes."><span>Recursos </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=25"><img height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/tutoriales.png" alt="Mírate los <b>Tutoriales</b> del foro para aprender o mejorar en el diseño gráfico."><span>Tutoriales </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=27"><img height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/evaluacion.png" alt="Haz un <b>Examen</b> para medir tu nivel de diseñador y calificar tus creaciones."><span>Evaluación </span></a></div>
<div id="arrow"><div style="clear: both" id="img_list_alt"><b>¡Toda una gama de servicios a su disposición!</b></div></div>
Dame la url de donde te sacaste ése code.
Nada, sigue sin funcionar 
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
})
.mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=17"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/exposiciones.png" alt="Las <b>Exposiciones</b> ayudan a que tus nuevas creaciones sean comentadas por los miembros."><span>Exposiciones </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=19"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/galerias.png" alt="En las <b>Galerías</b> puedes exponer todas tus creaciones hechas a lo largo del tiempo."><span>Galerías </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=20"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/duelos.png" alt="Haz <b>Duelos</b> contra otros usuarios para ver quien es mejor diseñador."><span>Duelos </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=21"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/torneos.png" alt="Participa en los <b>Torneos</b> del foro y podrás ganar fantásticos premios."><span>Torneos </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=23"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/recursos.png" alt="Bájate <b>Recursos</b> para que tus creaciones sean aún más sorprendentes."><span>Recursos </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=25"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/tutoriales.png" alt="Mírate los <b>Tutoriales</b> del foro para aprender o mejorar en el diseño gráfico."><span>Tutoriales </span></a></div>
<div class="img_list_hp img"><a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=27"><img height="65" src="images/pronavy/ficons/Otros/Indice_interactivo/evaluacion.png" alt="Haz un <b>Examen</b> para medir tu nivel de diseñador y calificar tus creaciones."><span>Evaluación </span></a></div>
<div id="arrow"><div style="clear: both" id="img_list_alt"><b>¡Toda una gama de servicios a su disposición!</b></div></div>
JAJA Mira que soy idiota jaja
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
})
.mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=17"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/exposiciones.png" alt="Las <b>Exposiciones</b> ayudan a que tus nuevas creaciones sean comentadas por los miembros."><span>Exposiciones </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=19"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/galerias.png" alt="En las <b>Galerías</b> puedes exponer todas tus creaciones hechas a lo largo del tiempo."><span>Galerías </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=20"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/duelos.png" alt="Haz <b>Duelos</b> contra otros usuarios para ver quien es mejor diseñador."><span>Duelos </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=21"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/torneos.png" alt="Participa en los <b>Torneos</b> del foro y podrás ganar fantásticos premios."><span>Torneos </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=23"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/recursos.png" alt="Bájate <b>Recursos</b> para que tus creaciones sean aún más sorprendentes."><span>Recursos </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=25"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/tutoriales.png" alt="Mírate los <b>Tutoriales</b> del foro para aprender o mejorar en el diseño gráfico."><span>Tutoriales </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=27"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/evaluacion.png" alt="Haz un <b>Examen</b> para medir tu nivel de diseñador y calificar tus creaciones."><span>Evaluación </span></a>
<div id="arrow"><div style="clear: both" id="img_list_alt"><b>¡Toda una gama de servicios a su disposición!</b></div></div>
Dime de donde te sacaste ese code !!!
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($) {
jQuery('.img_list_hp img').mouseover(function() {
jQuery('#img_list_alt').html(jQuery(this).attr('alt'));
})
.mouseout(function() {
jQuery('#img_list_alt').html('<b>¡Toda una gama de servicios a su disposición!</b>');
});
});
</script>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=17"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/exposiciones.png" alt="Las <b>Exposiciones</b> ayudan a que tus nuevas creaciones sean comentadas por los miembros."><span>Exposiciones </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=19"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/galerias.png" alt="En las <b>Galerías</b> puedes exponer todas tus creaciones hechas a lo largo del tiempo."><span>Galerías </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=20"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/duelos.png" alt="Haz <b>Duelos</b> contra otros usuarios para ver quien es mejor diseñador."><span>Duelos </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=21"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/torneos.png" alt="Participa en los <b>Torneos</b> del foro y podrás ganar fantásticos premios."><span>Torneos </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=23"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/recursos.png" alt="Bájate <b>Recursos</b> para que tus creaciones sean aún más sorprendentes."><span>Recursos </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=25"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/tutoriales.png" alt="Mírate los <b>Tutoriales</b> del foro para aprender o mejorar en el diseño gráfico."><span>Tutoriales </span></a>
<a href="http://neverfall.co.cc/foro/forumdisplay.php?fid=27"><img class="img_list_hp" height="65" src="{$mybb->settings['bburl']}/images/pronavy/ficons/Otros/Indice_interactivo/evaluacion.png" alt="Haz un <b>Examen</b> para medir tu nivel de diseñador y calificar tus creaciones."><span>Evaluación </span></a>
<div id="arrow"><div style="clear: both" id="img_list_alt"><b>¡Toda una gama de servicios a su disposición!</b></div></div>
Dime de donde te sacaste ese code !!!