iframe

Question

के भीतर पृष्ठ अलग-अलग दिखाएं (सीएसएस) यदि शीर्षक कहता है कि "iframe के भीतर पृष्ठ को अलग-अलग दिखाएं (सीएसएस)" के रूप में कोई तरीका है। यदि साइट आईफ्रेम के भीतर है तो मैं संभावित रूप से एक अलग सीएसएस स्टाइलशीट का उपयोग करने के लिए एक jQuery/जावास्क्रिप्ट विधि की तलाश में हूं। कोई विचार?

Answer 1

यदि आप top window नहीं हैं तो आप inject एक अलग स्टाइलशीट कर सकते हैं।

if (window.top!=window.self) 
{ 
    // In a Frame or IFrame 
} 
else 
{ 
    // Not in a frame 
} 

Answer 2

if(self != top) { 
    headTag = document.getElementsByTagName("head")[0].innerHTML; 
    var frameCSS = headTag + '<style type="text/css">**insert CSS here**</style>'; 
    document.getElementsByTagName('head')[0].innerHTML = frameCSS; 
} 

तो पेज केवल पेज प्रदर्शित किया जा रहा है, ऊपर, माता-पिता, स्वयं और खिड़की बराबर हो जाएगा। यदि पृष्ठ एक फ्रेमसेट के भीतर आयोजित किया जा रहा है, तो स्वयं और शीर्ष बराबर नहीं होंगे। यदि पृष्ठ फ़्रेमसेट वाला पृष्ठ है, और यह स्वयं फ़्रेमसेट के भीतर नहीं रखा जा रहा है, तो स्वयं और शीर्ष बराबर होंगे।

Answer 3

एक नई स्टाइलशीट इंजेक्ट करने की बजाय, मैं body पर एक सीएसएस कक्षा जोड़ने का सुझाव दूंगा।

jQuery उदाहरण:

$(function() { 
    if (window.self != window.top) { 
    $(document.body).addClass("in-iframe"); 
    } 
}); 

अब आप अलग तरह

.in-iframe p { 
    background: purple; 
} 

Answer 4

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

किसी भी सीएसएस या जे एस लोड होने से पहले head तत्व के भीतर इस स्थान:

// Sets the class of the HTML element using vanilla JavaScript 
document.documentElement.className += (window.self == window.top ? " top" : " framed"); 

फिर अपने सीएसएस/एस.ए.एस.एस./कम समय में आप, छिपा कर सकते हैं शो, और आधारित tweak जिस पर वर्ग लागू किया गया था।

/* Hide site navigation when in an iframe */ 
html.framed .site-nav, 
html.framed .site-footer { 
    display: none; 
} 

पीएसए: X-Frame-Options का लाभ लेने का अपहरण कर लिया जा रहा से अपनी कड़ी मेहनत रखने के लिए विचार करें।