2015-02-10 57 views
0

我是一個新手,jQuery和試圖追加瀏覽器的尺寸調整,原本改變了DOM自己的位置和他們一樣換檔向上或向下響應式設計要求的元素一些項目。元素追加或者說接受性改變自己的立場,當我縮小瀏覽器一樣< 767px,但我面臨的問題是在恢復元素到原來的位置和風格上的瀏覽器升遷,像> 768px或者說撤消追加我做在< 767px。我正在使用以下代碼。 在此先感謝。消除對瀏覽器appened項目調整與jQuery

$(document).ready(function(){ 
jQuery(window).resize(function(){ 
var wwindow = jQuery(window).width(); 
    if (wwindow < 767) { 
      $(".contact").after($(".social")); 
      $(".strip-right").prepend($(".ingrese")); 
      $(".strip-right").prepend($(".news")); 
      $(".contact-info .box .col3").after($(".contact-info .box .col1")); 
      $(".property-list .common h4 span").prepend("/&nbsp;"); 
      $(".clients").after($(".content-box .col2")); 
      $(".banner").before($(".caption2")); 
      $(".banner").before($(".caption2")); 
      $(".caption2 .row").before($(".caption2 .txtb h3 strong")); 
      $(".caption2 > strong").append($(".ref")); 
      $(".caption2 > strong > span").prepend("|&nbsp;"); 
    } 
    if (wwindow > 768) { 
      $(".social").remove(); 
      $(".ingrese").remove(); 
      $(".news").remove(); 
      $(".contact-info .box .col1").remove(); 
      $("/&nbsp;").remove(); 
      $(".content-box .col2").remove(); 
      $(".caption2").remove(); 
    } 
}); 
}); 
+0

還有一兩件事,如果我刷新頁面後> 768px,這說明什麼,我正好需要,但沒有刷新它DOSS不會改變它的外表相應的後768 – 2015-02-10 05:59:12

+0

在你的代碼中,我可以在你使用這兩個地方看看如果(wwindow <767){,if(wwindow <768){,那裏有錯誤? – abhiklpm 2015-02-10 06:07:40

+0

這是一個錯字:(但即使我用> 768px它並沒有什麼不刷新頁面?我如何能實現我想要什麼?任何想法 – 2015-02-10 06:16:26

回答

0
@media screen and (max-width: 768px) { 
    .social,.ingrese,.news,.contact-info .box .col1,.content-box .col2,.caption2{ 
     display: none; 
    } 
} 

@媒體標籤是由像骨架,衆所周知它的響應deisgn啓動時使用。你可以僅僅通過增加他們像上面,當你的瀏覽器達到768最大寬度將蘋果的CSS加入@media標籤

+0

是的,你是對的@dharmesh,我已經做到了在各種情況下,控制頁面,但我不想過度使用它,因爲它會要求我做出多種元素,DOM和隱藏相同的內容,並與媒體查詢顯示它們。任何jQuery的解決方案? – 2015-02-10 06:18:59

0

我用下面的下面的代碼來刷新頁面超出> 768px,這似乎隱藏元素工作,但需要1或2秒鐘來刷新頁面大小後。

$(window).resize(function() { 
window.location.href = window.location.href; 
});