Foros del Web » Programando para Internet » Javascript »

Problemas de FadeIn en un elemento

Estas en el tema de Problemas de FadeIn en un elemento en el foro de Javascript en Foros del Web. Hola, estoy realizando un proceso de compra donde al apretar unos botones te aparecen unos y te desaparecen otros, de forma muy dinámica. Sé como ...
  #1 (permalink)  
Antiguo 08/11/2012, 03:38
Avatar de sergi_multimedia  
Fecha de Ingreso: noviembre-2010
Mensajes: 213
Antigüedad: 14 años
Puntos: 4
Pregunta Problemas de FadeIn en un elemento

Hola, estoy realizando un proceso de compra donde al apretar unos botones te aparecen unos y te desaparecen otros, de forma muy dinámica.

Sé como se hace FadeIn en Jquery, porque lo llevo realizando a lo largo de la web, pero no se porque hay un momento que estoy haciendo lo mismo pero no hace caso a la acción, NO LO ENTIENDO

Os muestro el código:

Código HTML:
Ver original
  1. <div class="bloc-payment" id="pa-black-6i-s-s-yes">
  2.                 <span class="step">Step 4 - Buy your cable</span>
  3.                 <ul class="state">
  4.                     <li class="state">Select your state
  5.                         <ul>
  6.                             <li class="noh">Alabama</li>     <li class="noh">Indiana</li>       <li class="noh">Nebraska</li>       <li class="noh">Rhode Island</li>
  7.                             <li class="noh">Alaska</li>      <li class="noh">Iowa</li>          <li class="noh">Nevada</li>         <li class="noh">South Carolina</li>
  8.                             <li class="noh">Arizona</li>     <li class="noh">Kansas</li>        <li class="noh">New Hampshire</li>  <li class="noh">South Dakota</li>
  9.                             <li class="noh">Arkansas</li>    <li class="noh">Kentucky</li>      <li class="noh">New Jersey</li>     <li class="noh">Tennessee</li>
  10.                             <li class="noh">California</li>  <li class="noh">Louisiana</li>     <li class="noh">New Mexico</li>     <li class="noh">Texas</li>
  11.                             <li class="noh">Colorado</li>    <li class="noh">Maine</li>         <li class="noh">New York</li>       <li class="noh">Utah</li>
  12.                             <li class="noh">Connecticut</li> <li class="noh">Maryland</li>      <li class="noh">North Carolina</li> <li class="noh">Vermont</li>
  13.                             <li class="noh">Delaware</li>    <li class="noh">Massachusetts</li> <li class="noh">North Dakota</li>   <li class="noh">Virginia</li>
  14.                             <li class="noh">Florida</li>     <li class="noh">Michigan</li>      <li class="oh">Ohio</li>            <li class="noh">Washington</li>
  15.                             <li class="noh">Georgia</li>     <li class="noh">Minnesota</li>     <li class="noh">Oklahoma</li>       <li class="noh">West Virginia</li>
  16.                             <li class="noh">Hawaii</li>      <li class="noh">Mississippi</li>   <li class="noh">Oregon</li>         <li class="noh">Wisconsin</li>
  17.                             <li class="noh">Idaho</li>       <li class="noh">Missouri</li>      <li class="noh">Pennsylvania</li>   <li class="noh">Wyoming</li>
  18.                             <li class="noh">Illinois</li>    <li class="noh">Montana</li>
  19.                         </ul>
  20.                     </li>
  21.                 </ul>
  22.                 <div class="result">
  23.                     <div id="pa-black-6i-s-s-yes-noh">
  24.                         <span class="price">29.95 $</span>
  25.                         <div class="add">
  26.                             <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
  27.                                 <input type="hidden" name="cmd" value="_s-xclick">
  28.                                 <input type="hidden" name="hosted_button_id" value="MM37PAL8ZHAVU">
  29.                                 <input type="image" src="http://sergibeltran.com/jim/img/add.png" name="submit" alt="PayPal. La forma rápida y segura de pagar en Internet.">
  30.                                 <img alt="" src="https://www.paypalobjects.com/es_ES/i/scr/pixel.gif" width="1" height="1">
  31.                             </form>
  32.                         </div>
  33.                         <span class="comment">* The shipping will be free and the estimed will be 7 days</span>
  34.                     </div>
  35.                 </div>
  36.                 <div class="result">
  37.                     <div id="pa-black-6i-s-s-yes-oh">
  38.                         <span class="price">35.95 $</span>
  39.                         <div class="add">
  40.                             <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
  41.                                 <input type="hidden" name="cmd" value="_s-xclick">
  42.                                 <input type="hidden" name="hosted_button_id" value="MM37PAL8ZHAVU">
  43.                                 <input type="image" src="http://sergibeltran.com/jim/img/add.png" name="submit" alt="PayPal. La forma rápida y segura de pagar en Internet.">
  44.                                 <img alt="" src="https://www.paypalobjects.com/es_ES/i/scr/pixel.gif" width="1" height="1">
  45.                             </form>
  46.                         </div>
  47.                         <span class="comment">* The shipping will be free and the estimed will be 7 days</span>
  48.                     </div>
  49.                 </div>
  50.                 <div class="summary">
  51.                     <p>Summary</p>
  52.                     <ul>
  53.                         <li class="back-1">Back to step 1 - Choose color ( Black )</li>
  54.                         <li class="back-2">Back to step 2 - Choose length ( 6 inches )</li>
  55.                         <li class="back-3">Back to step 3 - Choose connector ( Straight / Straight / Gold ends )</li>
  56.                     </ul>
  57.                 </div>
  58.             </div>

Código Javascript:
Ver original
  1. $("#pa-black-6i-s-s-yes .noh").click(function(evento){
  2.         $("#pa-black-6i-s-s-yes-noh").fadeIn('5000');
  3. });

Código CSS:
Ver original
  1. #pa-black-6i-s-s-yes .result {display: none; }
  2. #pa-black-6i-s-s-yes-noh {display: none; }

Al apretar un país que no sea Ohio (tiene una clase diferente) tiene que aparecer un elemento.

Podéis ver la página, para que veais como funciona.

Tenéis que seguir este ruta para que llegueis a donde no me funciona el FadeIn.

Patch Cables > Black > 6i > Straight / Straight > YES > Select your state

Y entonces eliges un estado que no sea Ohio, y veréis que no pasa nada.

http://sergibeltran.com/Jim4/patch_cables

Un saludo y muchas gracias! ;)

Etiquetas: fadein, jquery
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:08.