[jQuery] Re: Slide in - slide out not working, am i silly?

[Paul Mills]

Have you got your classes and ids mixed up. The javascript $("#extra")
is acting on id="extra" but I don't see anything with this id in your
code. There is a <div> with class="extra" - which would be $
(".extra").

Paul

On Nov 20, 6:47 pm, livewire9174 <[EMAIL PROTECTED]> wrote:
> Hi,
> No idea what I'm doing wrong, I hope its not something very simple....
>
> I want to be able to click on the button with class btn slide and
> expand the "extra" Div, here is the CSS for hextra
>
> .extra{
>         overflow:hidden;
>         color:#349ACB;
>         clear:both;
>         font-family:Verdana, Arial, Helvetica, sans-serif;
>         background-color:#E6EBF1;
>         border:2px solid #2297D5;
>         *float:left;
>         display: none;
>
>         }
>
> here is the JS
>
> here is my code
>
> <script src="js/jquery.js" type="text/javascript"></script>
> <script type="text/javascript">
> $(document).ready(function(){
>
>         $(".btn-slide").click(function(){
>                 $("#extra").slideToggle("slow");
>                 $(this).toggleClass("active"); return false;
>         });
>
> });
>
> </script>
>
> + html
>
>   <div class="waffless-resturent"><img src="image/plua2.jpg"
> class="btn-slide" alt="" />&nbsp;test<span class="waffless-
> resturent2">&nbsp;&nbsp;&nbsp;119 sdfdf</span></div>
>           <div class="crok3">Dubdfdfdf2</div>
>           <div class="crok1">01 554556663</div>
>           <div class="crok2">American</div>
>           <div class="crok"><img src="image/star2.jpg" alt=""
> width="31" height="16" /></div>
>           <div class="crok4"><img src="image/my.jpg" alt="" width="16"
> height="17" /></div>
>           <div class="frends">0</div>
>           <div class="extra">
>           <div id="img-map">
>             <div class="img-viw">&nbsp;<img src="image/zoom.jpg"
> alt="click here" />
>                 <div class="map-deraction">Img</div>
>             </div>
>             <div class="img-viw2">&nbsp;<img src="image/zoom.jpg"
> alt="click here" />
>                 <div class="map-deraction"> Map + Directions</div>
>             </div>
>             <div class="view-more-image"><a href="#">VIEW MORE IMAGES
> +</a></div>
>             <div class="view-more-image2"><a href="#">VIEW LARGE MAP
> +</a></div>
>           </div>
>           <div id="opning-hours">
>             <div class="hours-opning-time">Opening Hours<br />
>                 <span class="hours-opning-time2">Lunch: Mon-Sun
> 12.00-16.00<br />
>                   Evening:18.00-21.30<br />
>               </span></div>
>             <div class="hours-opning-time-menu">View menu &amp; Our
> news:</div>
>             <div class="images-menu"><img src="image/menus.jpg"
> alt="menu" width="48" height="31" /></div>
>             <div class="images-menu"><img src="image/news.jpg"
> alt="news" width="48" height="31" /></div>
>             <div class="hours-opning-time-menu">Website:<span
> class="hours-opning-time2">www.123.ie</span></div>
>             <div class="clear"></div>
>             <div class="hours-opning-time-menu">Capacity: 40</div>
>             <div class="clear"></div>
>             <div class="hours-opning-time-
> menu">Facilities&nbsp;&nbsp;&nbsp;</div>
>             <div class="faclities-friend"><img src="image/frend.jpg"
> alt="friends" /></div>
>             <div class="faclities-friend"><img src="image/somking.jpg"
> alt="smoking" /></div>
>             <div class="faclities-friend"><img src="image/bar.jpg"
> alt="bars" /></div>
>             <div class="faclities-friend"><img src="image/card.jpg"
> alt="Card" /></div>
>             <div class="faclities-friend"><img src="image/outside.jpg"
> alt="out side" /></div>
>             <!-- <div class="faclities-friend"><img src="image/
> plan.jpg" alt="plan" /></div> -->
>           </div>
>         </div>
>
> Please help if you can, I'm desperate!!!