jQuery Forum

1. $ ( '.scrollableArea a' ). click ( function () {  
2.     var newObjElement = '<object style="width:580px;height:386px;"><param name="movie" value="http://www.youtube.com/v/' + this . id + '?version=3&autoplay=1"><embed src="http://www.youtube.com/v/' + this . id + '?version=3&autoplay=1" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="580" height="386"></object>' ;
3.     mainArea . html ( newObjElement );
4. });

I am trying to change the object element, through click event. (to load in a new video)

Each anchor, has a specified id of video id (youtube) which I use to alter src and value attributes.

This works in most browsers, (safari, opera, chrome, firefox, ie8 / 9) with exception of ie6, and 7. (although not concerned for ie6)

Any ideas as to why / how to resolve the issue for ie7?

Cheers!

Hi there, I'm experiencing a problem with the following banner slider found here:
http://www.build-green.com/

when you click / scroll through the different 'projects' too quickly .. (clicking the next repeatably) it sometimes, and often times, displays a blank slide. (white background) and results in actions (previous and next) no longer being triggered...

Any ideas why? or how to get around this issue?

Thanks in advance!
Michael

I'm working on a banner 'slider' with a next, and previous button.
There are 3 li elements i'm targetting.

In plain english, this is what i'm trying to achieve -
"if the last li element is displayed, (visible) - then hide it, and display the first element.."

1. if ($('li:last').is(':visible')) {
2. // code to execute
3. }

Any help / suggestions well appreciated!

Hello -
I'm trying to do the following in plain english.

When '#next' clicked, hide current 'li' element, and display the next.
IF 'li:last' - rewind / 'show()' first li again.

here is what i have so far.. please provide me with explanation to what's being done with your suggested approach. (also explain if possible, what was wrong on my end.)

Thanks in advance!

1. $('a#next').click(function() {   
2.         var curlistItem = $('li:visible'); // find our 'visible' li element, and assign it to variable
3.         var nextlistItem = curlistItem.next(); // take the 'visible' element, and append the 'next' element
4.        
5.         curlistItem.hide(); // hide the visible element
6.         nextlistItem.show(); // show the next element
7.        
8.         if (nextlistItem.is('li:last')) { //if last 'li' element,
9.         //restart, rewind, bring back to first 'li'
10.         alert ('this should only display if current list item last element');
11.         }   
12.     });

Hello all,
as you can tell by the following statements, i'm new to jQuery.
I'm trying to do the following (in plain english) without too much success..

Any help would be gladly appreciated!
--

1) when document ready..
2) find the element with id 'next'.
3) pull / take all 'li' elements, and perform so and so, all whilst excluding 'last' element.

1. $(document).ready(function() {
2.     $('#next').click(function() {
3.       $('li').each(function() { //for each li ..
4.          
5.         $(this).filter(':last'); //exclude last item in sequence?
6.         $(this).fadeOut('slow'); //fade out current
7.         $(this).next().fadeIn('slow'); //bring in next
8.      
9.       });
10.     });
11. });

My questions are..
- Why is the 'filter' method not being properly executed?
- How can i perform a simple transition from one li to the next? (when element with id 'next' is clicked)

*Currently, (with provided script) - it clicks / scrolls through all the way to last element, (quickly) and then fades out..

Hello jQuery community -
I have the following code, which works great, but i'm looking for any suggestions that could help condense / simplify this code, considering it's essentially doing the same thing, in exception to the different input element + it's associated value.

For clarity's sake, i've highlighted the differentiators in red.

1. //CLEAR / RESET PRE-DEFINED FORM FIELD VALUES
2.     $("div#name input").focus(function() {
3.         if ($(this).val() == "Your name") {
4.         $(this).val('');
5.             $(this).css({
6.             'font-style': 'normal',
7.             'color': '#333'
8.             });
9.         }
10.     });//End
11.    
12.     $("div#email input").focus(function() {
13.         if ($(this).val() == "Your email") {
14.         $(this).val('');
15.             $(this).css({
16.             'font-style': 'normal',
17.             'color': '#333'
18.             });
19.         }
20.     });//End

Hi all, I am new to jQuery, in learning process..

described below is my dilemma:
I have a 'main' navigation, that display a dropdown / sub navigation where necessary.

I'm trying to achieve the following -
1) considering the parent tab has no associated page, I want to ..

Problem?
With the code pasted below, i've successfully achieved the custom css.. problem -
not working as intended.

1. /*MAIN NAV, APPLY CUSTOM
2. CSS BASED ON 'IF' ANY CHILDREN (SUBNAV) PRESENT*/
3.     $("ul.nav.top li a").hover(function() {
4.         if ($(this).has('ul.dropdown')) {
5.         $(this).css("cursor", "default");
6.         }
7.         //revert to standard 'pointer' for child anchor elements
8.         $("ul.dropdown li a").css("cursor", "pointer");
9.     });

Hi all, here are my intentions.
1) display defaulted 'tertiarynav' for first subnav item and hide rest
2) when a different subnav is clicked, display it's 'tertirary nav'
3) when the selected / active dropdown is clicked, hide it's contents.

My problem with following script, when clicking the selected / active dropdown, it slides up and back down again.

1. $(document).ready(function(){
2.         $('ul#sidebar li.subnav ul.childnav:not(:first)').hide();
3.        
4.         //select anchors in 'subnav' li, but NOT children
5.         $('.subnav a:not(.childnav a)').click(function(){
6.             $('.childnav:visible').slideUp('slow');
7.             $(this).next().slideDown('fast');
8.             return false; //cancel click through       
9.         });
10.     });

1. <ul id="sidebar">
2.         <li>Video Library
3.         <ul>
4.         <li class="subnav"><a href="#nogo" title="Getting Started">Getting Started</a>
5.                 <ul class="childnav" style="margin-left:20px;padding-right:20px;">
6.                 <li><a href="#nogo" title="How The Referral Program Works">
7.                 How The Referral Program Works</a></li>
8.        
9.                 <li><a href="#nogo" title="&ldquo;May I Make a Recommendation?&rdquo; - How to Ask For a Referral">
10.                 &ldquo;May I Make a Recommendation?&rdquo; - How to Ask For a Referral</a></li>
11.                
12.                 <li><a href="#nogo" title="Talking Points - How To Start the Conversation">
13.                 Talking Points - How To Start the Conversation.</a></li>
14.                
15.                 <li><a href="#nogo" title="Who We Are - Laughlin Associates">
16.                 Who We Are - Laughlin Associates, <abbr title="Incorporation">inc.</abbr></a></li>
17.                 </ul><!--3-->
18.         </li><!--2-->
19.        
20.         <li class="subnav"><a href="#nogo" title="Understanding Business Entities">Understanding Business Entities</a>
21.                 <ul class="childnav" style="margin-left:20px;padding-right:20px;">
22.                 <li><a href="#nogo">business entities 1</a></li>
23.                 <li><a href="#nogo">business entities 2</a></li>
24.                 <li><a href="#nogo">business entities 3</a></li>
25.                 <li><a href="#nogo">business entities 4</a></li>
26.                 </ul><!--3-->
27.         </li><!--2-->
28.        
29.         <li class="subnav"><a href="#nogo" title="The Corporate Veil Protection Service">The Corporate Veil Protection Service</a></li>
30.         </ul>
31.         </li><!--1-->
32.     </ul><!--End sidebar-->

Any suggestions?
Thanks in advance!