Jquery मोबाइल संवाद के लिए पृष्ठ पृष्ठभूमि को कैसे हटाएं?

Question

संवाद खुद ही पेज का लगभग 10% पर है और मैं हटाने या पारदर्शी में संवाद के पृष्ठ पृष्ठभूमि बारी ताकि पिछले पृष्ठ अब भी दिखाई पड़ेंगी करना चाहता था।

इस js कि संवाद कहता है:

$.mobile.changePage('#popdiv',{transition:'slide', role:'dialog'}); 

और इस div

<div data-role="page" id="popdiv" data-role="page" data-theme="e">   
    <div data-role="content"> 
    <h1>Congrats!</h1> 
    </div> 
</div> 

मैं कस्टम सीएसएस का उपयोग कर की कोशिश की है, लेकिन यह कुछ भी

div#popdiv { 
    background: none; // i also used background-image and color and set it to none 
} 

बदलने के लिए प्रतीत नहीं होता

और यह कैसे मैं CSS और JS घोषित है

<custom css> 
<jquery mobile css> 
<jquery min.js> 
<phonegap.js> 
<custom.js> 
<jquerymobile.js> 

कृपया मदद करते हैं। बहुत धन्यवाद।

Answer 1

मैं इस पाया है:

https://github.com/jtsage/jquery-mobile-simpledialog

यह एक jQuery मोबाइल प्लगइन है और यह क्या मैं वास्तव में चाहते हैं। :)

Answer 2

बस अपने सीएसएस

.ui-mobile [data-role="dialog"], .ui-page { 
display:block !important; 
} 

कि मेरे लिए काम करता करने के लिए इस जोड़ें।

Answer 3

स्वीकार्य उत्तर jQuery मोबाइल के लिए तृतीय पक्ष संवाद का उपयोग करने का सुझाव देता है। मौजूदा इनबिल्ट संवाद, तो निम्न काम करेंगे आप उपयोग करना चाहते हैं:

<link rel="stylesheet" href="themeroller/mobile.min.css" /> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile.structure-1.1.0.min.css" /> 
<link rel="stylesheet" href="mobile-custom.min.css" /> 

मेरे कस्टम सीएसएस (पोस्ट विषय और JQM मोबाइल संरचना सीएसएस):

मेरे सीएसएस क्रम इस तरह दिखता है

.ui-dialog-background { 
    opacity: 0.5; 
    display: block !important; 
    -webkit-transition: opacity 0.5s ease-in; 
} 

.ui-dialog-background.pop.in { 
    opacity: 1; 
    -webkit-transition: opacity 0.5s ease-in; 
} 

.ui-dialog { 
    min-height: 100% !important; 
    background: transparent !important; 
} 

और जावास्क्रिप्ट पृष्ठ लोड होने:

$(function() { 
    $('div[data-role="dialog"]').live('pagebeforeshow', function(e, ui) { 
    ui.prevPage.addClass("ui-dialog-background "); 
    }); 

    $('div[data-role="dialog"]').live('pagehide', function(e, ui) { 
    $(".ui-dialog-background ").removeClass("ui-dialog-background "); 
    }); 
}); 

स्रोत: Tom Clarkson

Answer 4

jQuery> 1.9 के लिए, रहते हैं() हटा दिया है। इस प्रकार आप जावास्क्रिप्ट को संशोधित करने के लिए निम्न करने के लिए कि Junto ऊपर पोस्ट किया गया है habe:

अन्य तत्वों अप

$(document).on('pagebeforeshow', 'div[data-role="dialog"]', function (e, ui) { 
    ui.prevPage.addClass("ui-dialog-background "); 
}); 

$(document).on('pagehide', 'div[data-role="dialog"]', function (e, ui) { 
    $(".ui-dialog-background ").removeClass("ui-dialog-background "); 
});