Выделить div в течение нескольких секунд

У меня есть много div, когда когда-либо я один из div, его содержимое копируется в верхнюю часть div, но я хочу выделить самый верхний div, как я могу это сделать с помощью jQuery.

код:

<div id="code"> </div>

<div id="1">Click Me</div>
<div id="2">Click Me, please</div>

Когда я нажимаю div либо с идентификатором 1 или 2, его содержимое копируется в div с идентификатором "code", но мне нужно выделить несколько секунд, чтобы я мог уведомить пользователя о том, что что-то изменилось.

Ответ 1

попробуйте это.... jquery имеет Выделить, чтобы достичь этого.

$(document).ready(function() {
$('div.success').effect("highlight", {}, 3000);
});

Ответ 2

Если вы используете jQuery UI, вы можете сделать это:

$('#code').effect('highlight',{},3000); // three seconds

Отдельно, ваши идентификаторы на этих нижних двух элементах недействительны. Вы не можете запустить идентификатор с номером (кроме, как указывает Вивек, в HTML5). Вместо 1 или 2 используйте что-то с некоторым семантическим значением, например answer1 или article1.

Изменить: здесь, как это сделать, используя текущий HTML, включая обработчик кликов для div:

$('#a1,#a2').click( function(){
   $('#code')
       .html( $.trim( $(this).text() ) )
       .effect('highlight',{},1000); 
});

Здесь он находится в действии: http://jsfiddle.net/redler/KrhHs/

Ответ 3

очень быстрый и грязный способ сделать это (5 минут, смотря на документацию: p):

<script>
  $(function() {
    //when clicking on all div but not the first one
    $("div:not(:first)").click(function() {
      //Content of the selected div gets copied to the top one
      $("div:first").text($(this).text());
      //At the end of the first animation execute the second animation
      $("div:first").animate({
          opacity:"0.5"
      }, 1000, function() {
        $("div:first").animate({
            opacity:"1"
        }, 1000);
      });
    });
  });

</script>

Надеюсь, что это поможет!