Простое отображение Jquery на MouseEnter Вопрос - PullRequest
0 голосов
/ 05 июля 2011

Я новичок в stackoverflow и Jquery, поэтому я хотел бы заранее извиниться за мою неопытность / наивность.

Итак, по сути, я пытаюсь отобразить div, когда кнопка находится в состоянии mouseEnter.

Вот моя попытка Jquery ...

$('#main-button-btn-cart').bind('mouseenter', function() {
    var $select_button = $('#select-product-reminder');

    $select_button.style.display = 'inline-block';
});

и HTML-код ...

  <div id="select-product-reminder" style="width:200px; height:30px; background-color:#F00; display:none;">Please Choose an Item</div>
    <button type="button" id="main-button-btn-cart" title="<?php echo $this->__('Add to Cart') ?>" class="button btn-cart" onclick="productAddToCartForm.submit()">
      <?php echo $this->__('+ADD TO CART') ?>
    </button>

По какой-то причине этот код не работает.Тем не менее, может быть полезно отметить, что, если я включаю окно оповещения в свою функцию привязки, оно появляется.

Заранее благодарен за любой ввод!

Ответы [ 3 ]

1 голос
/ 05 июля 2011

Вы могли бы сделать это:

$('#main-button-btn-cart').bind('mouseenter', function() {
    $('#select-product-reminder').show();
});

также вы можете сделать это

$('#main-button-btn-cart').onmouseenter(function() {
    $('#select-product-reminder').show();
});

onmouseenter - это короткий путь вместо вызова функции связывания

0 голосов
/ 05 июля 2011

Я бы использовал что-то похожее на это: $ ('# main-button-btn-cart'). Live ('mouseenter', function () {$ ('# select-product-Remder'). Show ();
});

0 голосов
/ 05 июля 2011

Это должно сработать;

$('#main-button-btn-cart').mouseenter(function() {
    var $select_button = $('#select-product-reminder');
    $($select_button).css('display','inline-block');
});

Или вы можете покончить с var;

$('#main-button-btn-cart').mouseenter(function() {
    $('#select-product-reminder').css('display','inline-block');
});

Обновление для клика;

$('#main-button-btn-cart').mouseenter(function() {
  $('#select-product-reminder').css('display','inline-block');
  $(this).click(function() {
    alert('You clicked the button');
  });
});
...