CODEWITHSUNDEEP
jquery
Suneel Prakash
Suneel Prakash

Reputation: 27

Jquery should run only when the check box is checked in

enter code hereMy requirement is i am having the images and a check box on a page.Now when the check box is checked in and when i place my mouse hover the image the jquery should run.

When the check box is checked out and the mouse hover is on the image the jquery should not run....

my code is like this..

$(document).ready(
 function()
    {
     $("#box img").click(
            function()
                {

                    var sr=$(this).attr("src");                    
                    //alert(sr);
                    $("#box2 img").fadeOut("slow",function(){
                    $("#box2").html("<img src='"+sr+"' style='opacity:0.30'/>");
                    $("#box2 img").fadeTo("slow",1);
                    });


                }
        );
        $("#box img").hover(
            function()
            {
                $(this).css({'z-index' : '10','border':'4px solid white'});
                $(this).animate({
                marginTop: '-110px',
            marginLeft: '-110px',
            top: '50%',
            left: '50%',
            width: '200px',
            height: '200px'        
            },200);
            },

Now i need to run this functions only when the check box is checked in...

Upvotes: 0

Views: 165

Answers (4)

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

Asuming you have something like:


<input type="checkbox" id="chk_1" name="chkbox[]" value="" />
<img id="img_1" src="some_image.jpg" />

<script type="text/javascript">
$(document).ready(function() {
  $("img[id^='img_']").mouseover(function() {
      var id = $(this).split("_")[1];
      if($("input[id='chk_"+id+"']").is(":checked")) {
          //run something
      }
  });
});
</script>

Upvotes: 0

Ali Haider
Ali Haider

Reputation: 517

What I think you want is:

$('#image').hover(function () {
if ($('#checkbox').is(':checked')) {
    //Your code to do what ever you want on entry
}
}, function () {
if ($('#checkbox').is(':checked')) {
    //Your code to do what ever you want on exit
}
});

Upvotes: 1

kingpin
kingpin

Reputation: 1498

I guess you want to execute some javascript code (with jquery) in particular cases only, right?

so suppose you have checkbox with id="check" and image with id="pix"

you have to put this in your document ready part:

$('#pix').mouseover(function(){
  if($('#check').is(':checked')){
    //your code is here or function call
  }
});

Upvotes: 1

Rumplin
Rumplin

Reputation: 2768

$('#image_1').mouseover(function() {
  if ($('#checkbox_1').is(':checked').length == 1)
  {
     // do stuff
  } 
});

Upvotes: 0

Related Questions