試圖預先取決於屏幕大小的文本

Question

我試圖替換，然後prepend文本上的元素，似乎無法讓它的工作。我有替換工作，然後似乎停止了，當我試圖預先文本。

HTML：

<div id="topbar"> 
<p>Have Questions? Call us at: <b>1.555.55.5555</b></p> 
<a href="#">Home</a> 
<a href="#">Login</a> 
</div> 

JS：

function replacePhone() { 
if ($(window).width() < 786) { 
    console.log($("#topbar p").text()); 
    var text = $("#topbar p").text().replace('Have Questions?', ''); 
    $("#topbar p").text(text) 
} 
if ($(window).width() > 786) { 
    console.log($("#topbar p").text()); 
    var text = $("#topbar p").prepend.('Have Questions?'); 
    $("#topbar p").text(text) 
} 
} 
$(window).resize(function() { 
replacePhone(); 
}); 
$(document).ready(function() { 
replacePhone(); 
}); 

這裏是一個小提琴，如果這是對你更方便： http://jsfiddle.net/LxQQe/

Answer 1

使用CSS媒體查詢：

@media (min-width: 786px) { 
    #topbar p:before { 
    content: "Have Questions? "; 
    } 
}