CODEWITHSUNDEEP
jquery
gareth
gareth

Reputation: 189

Jquery when form is clicked hide other forms on the page

hello i have managed to fade inactive forms when the user is clicking within another form. each form has a class of palletbuilder. i would now like to hide the buttons within the other form to. the buttons have a class named addBUtton the code so far

$(".palletbuilder").click(function () {
    var $t = $(this);
    $t.siblings().animate({
     opacity: 0.5
        }, 500);

    $t.animate({
    opacity: 1
        }, 500);
});

Upvotes: 0

Views: 92

Answers (5)

Mark Schultheiss
Mark Schultheiss

Reputation: 34168

$(".palletbuilder").click(function() {
    var $t = $(this);
    $t.siblings().animate({
        opacity: 0.5
    }, 500).children('button.addBUtton, input:button.addBUtton').hide();
    $t.animate({
        opacity: 1
    }, 500).children().show();//show them again if click that form???
});

I did not know if you used input or button markup so I accounted for both. (or you could just use the class)

Edit: (just because) combine it all:

$(".palletbuilder").click(function() {
    $(this).animate({
        opacity: 1
    }, 500).children().show().end().siblings().animate({
        opacity: 0.5
    }, 500).children('button.BUtton, input.BUtton').hide();
});

Upvotes: 0

Călin Darie
Călin Darie

Reputation: 6237

$t.siblings().find(':input.addButton').hide()

Here's a fiddle

Upvotes: 0

codef0rmer
codef0rmer

Reputation: 10530

This is what you may be looking for: 

$t.children('.addBUtton').show();
$t.siblings().children('.addBUtton').hide();

Demo: http://jsfiddle.net/cdkAP/

Upvotes: 1

Ohgodwhy
Ohgodwhy

Reputation: 50787

Use the 'not' operator provided by jQuery to exclude objects. 

$(function() {
  $("form").hover(function(){
    $("form button").not($(this).find('button')).fadeTo(400, 0.5);
  }, function(){
$("form button").fadeTo(0, 1);  
  });
});

Upvotes: 0

Elen
Elen

Reputation: 2343

try:

$(".palletbuilder").click(function () {
    var $t = $(this);
    $t.siblings().animate({
     opacity: 0.5
        }, 500);

    $t.animate({
    opacity: 1
        }, 500);
    $(".addBUtton").each(function () {
      $(this).hide();
    )};
});

Upvotes: 1

Related Questions