Page 1 of 2 12 LastLast
Results 1 to 10 of 17

Thread: combine functions

  1. #1
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default combine functions

    is there a way to combine these 2 functions since they do the same thing?

    Code:
    $(document).ready(function(){
        $("img").click(function () {
          $("img").fadeOut("slow");
        });
      });
       $(document).ready(function(){
        $("p").click(function () {
          $("p").fadeOut("slow");
        });
      });

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Code:
    $(document).ready(function(){
        $("img").click(function () {
          $("img").fadeOut("slow");
        });
        $("p").click(function () {
          $("p").fadeOut("slow");
        });
      });
    or:

    Code:
    $(document).ready(function(){
        $("img, p").click(function () {
          $("img, p").fadeOut("slow");
        });
      });
    or even:

    Code:
    $(function(){
        $("img, p").click(function () {
          $("img, p").fadeOut("slow");
        });
      });
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default

    thank you

  4. #4
    Join Date
    Feb 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default same question, different way!

    does this solution cause the two .click events to run simultaneously or independently?

    my app needs multiple .click events each with a different element to run independently of each other.

    will play with this, while awaiting a reply.

    thanks
    bill

  5. #5
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    It depends upon which method of combining you use. The first method in my previous post will keep things the most separate. Experiment.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #6
    Join Date
    Feb 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    thanks john!
    I just need a push to get out of the ditch on this!

    I'm thinking it's all in the punctuation, but . . . .

    this is what I have:

    Code:
    $(document).ready(function(){
    
    $(".left_trigger").click(function(){
    		$(".left_panel").toggle("medium");
    		$(this).toggleClass("active");
    		return false;
    	});
    
    	$(".right_trigger").click(function(){
    		$(".right_panel").toggle("medium");
    		$(this).toggleClass("active");
    		return false;
    	});
    
        $(".bottomleft_trigger").click(function(){
    		$(".bottomleft_panel").toggle("medium");
    		$(this).toggleClass("active");
    		return false;
    	});
    
    });
    Last edited by jscheuer1; 02-27-2010 at 05:11 PM. Reason: format code

  7. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Looks fine to me. What's it doing that you don't want it to? Or what's it not doing that you want it to?

    Please post a link to a page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #8
    Join Date
    Feb 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    John, this page is still in the editor and not online.

    the setup up is this:

    one webpage with three minipages, or sliding panels
    one topright
    one topleft
    one bottomleft

    with working css and html in the editor, I can make each one work.

    what I cannot do yet, which is the whole thing, is get all three to be active onload simulataneously. they should be ready so when the user event .click occurs, the panel opens. The user cannot click in three places at one time so there should not be a problem with multiple panels being clicked to open and then clicked to close.

    what you are looking at gives an error message having something to do with punctuation, i.e. } or ) or ; depending on what combination is being tested, after several hours of this, I just have NOT found the right combination.

    thanks,
    bill

  9. #9
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Well, what you posted looks syntactically correct. In fact, if I run it on a page by itself using jQuery 1.4.2 and using a very rudimentary markup reflecting the classes named in the code:

    Code:
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    
    <script type="text/javascript">
    $(document).ready(function(){
    
    $(".left_trigger").click(function(){
    		$(".left_panel").toggle("medium");
    		$(this).toggleClass("active");
    		return false;
    	});
    
    	$(".right_trigger").click(function(){
    		$(".right_panel").toggle("medium");
    		$(this).toggleClass("active");
    		return false;
    	});
    
        $(".bottomleft_trigger").click(function(){
    		$(".bottomleft_panel").toggle("medium");
    		$(this).toggleClass("active");
    		return false;
    	});
    
    });
    </script>
    
    </head>
    <body>
    <div class="left_trigger">
    left_trigger
    </div>
    <div class="left_panel">
    left_panel
    </div>
    <div class="right_trigger">
    right_trigger
    </div>
    <div class="right_panel">
    right_panel
    </div>
    <div class="bottomleft_trigger">
    bottomleft_trigger
    </div>
    <div class="bottomleft_panel">
    bottomleft_panel
    </div>
    </body>
    </html>
    it gives no error. And it does what its code dictates, toggling both the display of panels and the class names of the triggers.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  10. #10
    Join Date
    Feb 2010
    Posts
    27
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    thank you john!

    let me put it in the editor and set what happens.
    I am a little nervous about this editor, it seems a times it is picking up noise from somewhere causing connections between html and css to break. have you ever heard of anything like that?

    Anyway, give me a few minutes and I'll let you know how it works.

    bill

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •