2013-07-08 12 views
6

पर एक प्रतिक्रियाशील वेबसाइट (उत्पत्ति ढांचे का उपयोग करके) मैं उत्तरदायी रूप से एक आईफोन और एचटीसी पर उत्तरदायी डिस्प्ले होने के लिए डिज़ाइन नहीं किया गया है लेकिन सैमसंग गैलेक्सी फोन पर नहीं है। (सैमसंग गैलेक्सी एस 2 और सैमसंग ऐस पर परीक्षण किया गया) मैं वर्तमान में वीडियो को उत्तरदायी बनाने के लिए फिटविड्स प्लगइन का उपयोग कर रहा हूं।वेबसाइट सैमसंग गैलेक्सी एस 2

अजीब बात यह है कि सैमसंग फोन पर कोई वीडियो एम्बेड नहीं किया गया है, लेकिन वीडियो एम्बेड के साथ एक पृष्ठ पर, पेज लेआउट प्रदर्शित होता है कि एक टैबलेट स्क्रीन के लिए और फोन स्क्रीन के लिए नहीं।

मैंने कई अन्य प्लगइन्स की कोशिश की है लेकिन उनमें से कोई भी इस समस्या को हल करने के लिए प्रतीत नहीं होता है।

यह अच्छा होगा अगर कोई इस पर कोई सलाह दे सके।

यहाँ मेरे site

है यहाँ सीएसएस stylesheet

+0

आप 2011 से 'jquery.fitvids.js' संस्करण' 1.0' का उपयोग कर रहे हैं - शायद आपको अपडेट की जांच करनी चाहिए। – birgire

+1

कृपया मेरी पोस्ट पाई, और मीडिया सीएसएस –

+0

डालने का प्रयास करें, मुझे इसका अच्छा जवाब देखना अच्छा लगेगा; किसी भी उत्तर में पता नहीं दिया गया है कि क्यों वीडियो वाला एक पृष्ठ बिना किसी के अलग-अलग कार्यों को एम्बेड करता है। –

उत्तर

2

उपयोग करने का प्रयास है यह

<meta content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" name="viewport"> 
3

के रूप में मैं ने पाया है कि सैमसंग स्क्रीन 480 * 800px

सीएसएस नीचे के साथ प्रयास करें है:

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : landscape) { 

} 

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : portrait) { 

} 

धन्यवाद

1

यह अनुशंसा नहीं की जाती है कि आप @media नियमों का उपयोग करें, क्योंकि मोबाइल डिवाइस बनाम डेस्कटॉप पर पिक्सेल आकार भिन्न हो सकता है।

उदाहरण के लिए, के बजाय:

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : landscape) { 

} 

@media only screen 
and (min-device-width : 480px) 
and (max-device-width : 800px) 
and (orientation : portrait) { 

} 

एक कंटेनर है कि एक मार्जिन छोड़ दिया 5% की और 5% का मार्जिन का अधिकार होगा जोड़ें:

<body> 
<div class="container"> 
# Your body goes here 
</div> 
</body> 

मैं इस एक मिल गया है मानक @media नियम की तुलना में उत्तरदायी डिजाइन के लिए अधिक उपयोगकर्ता के अनुकूल और बनाए रखा दृष्टिकोण।

संबंधित मुद्दे