jQuery手機突出顯示效果

Question

我正在尋找應用jQuery UI如突出顯示效果的元素，但我使用jQuery的手機。有沒有什麼內置到jQuery的移動，這將允許我這樣做，而不參考任何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/

它是一個很好的解決方案，因爲你不必使用方法：目標，這是爲建錨可以干擾jQuery Mobile ajax hrefs的hrefs;它也不需要jQuery UI的.effect功能，它不是爲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>