JQuery мобильный эффект выделения

Question

Я собираюсь применить jquery ui, как эффект выделения, к элементу, но я использую jquery mobile. Есть ли что-то встроенное в jquery mobile, которое позволило бы мне это делать, не ссылаясь на какие-либо вещи jquery ui?

Спасибо

Answer 1

Хотелось бы что-нибудь подобное?

ПРИМЕЧАНИЕ: это может повлиять на хеш-навигацию, но это все CSS

• http://jsfiddle.net/MEzAU/

CSS

:target {
    -webkit-animation: target-fade 3s 1;
    -moz-animation: target-fade 3s 1;
}

@-webkit-keyframes target-fade {
    0% { background-color: rgba(0,0,0,.1); }
    100% { background-color: rgba(0,0,0,0); }
}
@-moz-keyframes target-fade {
    0% { background-color: rgba(0,0,0,.1); }
    100% { background-color: rgba(0,0,0,0); }
}

HTML

<a href="#1">Link 1</a>
<a href="#2">Link 2</a>
<a href="#3">Link 3</a>
<p id="1">Paragraph 1</p>
<p id="2">Paragraph 2</p>
<p id="3">Paragraph 3</p>

Ссылка:

• http://snook.ca/archives/html_and_css/yellow-fade-technique-css-animations

Answer 2

Вы также можете попробовать это решение в технике желтого замирания: http://jsfiddle.net/xb8Km/

Это хорошее решение, потому что вам не нужно использовать: target, который создан для якорей, которые могут мешать jQuery Mobile ajaxhrefs;ему также не нужна функция .effect из пользовательского интерфейса jQuery, которая не предназначена для мобильных устройств jQuery.

<div class="yft">
    <div class="content">This is some content</div>
    <div class="yft_fade">&nbsp;</div>
</div>

<script>
  $(document).ready(function() {
    $(".yft").click(function() {
        $(this).find(".yft_fade").show().fadeOut();
    });
  });
</script>

<style>
  .yft_fade {
    background-color:yellow;
    display:none;
  }
  .content {
    position:absolute;
    top:0px;
  }
</style>