फैंसीबॉक्स लौटने "अनुरोधित सामग्री लोड नहीं की जा सकती है। कृपया बाद में पुनः प्रयास करें।" लिंक

Question

के साथ मैं इनलाइन सामग्री (एक नए पृष्ठ से जुड़ी एक छवि के साथ एक div) प्रदर्शित करने के लिए Fancybox का उपयोग कर रहा हूँ। डीवी और छवि मोडल में ठीक दिखती है, लेकिन जब नए पेज पर जाने के लिए छवि पर क्लिक किया जाता है, तो मुझे "अनुरोधित सामग्री लोड नहीं की जा सकती है। कृपया बाद में पुनः प्रयास करें।" त्रुटि।

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".fancybox").fancybox().hover(function() { 
      $(this).click(); 
     }); 
     $("#fancybox-outer").fancybox().mouseleave(function() { 
       $("#fancybox-overlay").click(); 
     }); 
    }); 
</script> 

और HTML के निम्नलिखित क्लिप पर लागू होता है:

FancyBox जावास्क्रिप्ट इस प्रकार है

<li class="fancybox-outer"> 
    <a id="inline" href="#hover-image_0" class="fancybox"> 
     <img src="http://website.com/file/id:63" style="margin-top: 32px" /> 
    </a> 
    <p><a href="http://website.com/template/view/18">1G2A</a></p> 
    <div style="display: none;"><div id="hover-image_0"><a href="http://website.com/template/view/18"><img src="http://website.com/file/id:64/ext:.png" class="img" /></a></div></div> 
</li> 

<li class="fancybox-outer"> 
    <a id="inline" href="#hover-image_1" class="fancybox"> 
     <img src="http://website.com/file/id:60" style="margin-top: 32px" /> 
    </a> 
    <p><a href="http://website.com/template/view/17">17</a></p> 
    <div style="display: none;"><div id="hover-image_1"><a href="http://website.com/template/view/17"><img src="http://website.com/file/id:61/ext:.png" class="img" /></a></div></div> 
</li> 

किसी को क्या समस्या या क्या मैं उसे ठीक करना चाहते कारण हो सकता है देखते हैं करता है?

धन्यवाद!

अद्यतन: 1/19/2012 - मैंने अपने सर्वर पर पहले उत्तर (http://estorkdelivery.com/example/example.html) के समान परीक्षण किया और पाया कि मुझे वही प्रतिक्रिया मिली है। तो ऐसा लगता है कि यह मेरे सर्वर के साथ कुछ है।

मुझे अभी भी इस समस्या के साथ मदद की ज़रूरत है। क्या किसी के भी पास कोई सुझाव है?

धन्यवाद!

अद्यतन: 1/28/2012 - मैं इस समस्या का हल ढूंढने के लिए काम कर रहा हूं, लेकिन मैं समय से बाहर हो गया हूं और एक पूरी तरह से अलग समाधान के साथ चला गया है। मैं इस समस्या को तब भी खोल रहा हूं जब कोई भी एक ही त्रुटि में चलता है या अंत में समाधान ढूंढता है। धन्यवाद!

Answer 1

आपका दृष्टिकोण कई मुद्दों है

बहुत स्पष्ट लेकिन आपके काम में दृष्टिकोण, खुले fancybox के अंदर लिंक (जो उदाहरण के लिए yahoo को लक्षित करता है) fancybox के लिए बाध्य नहीं है; यह फिर से निश्चित रूप से Fancybox को आग लगाने का प्रयास करेगा, लेकिन इस बार सामग्री के बारे में कोई संकेत नहीं होने पर, इसलिए त्रुटि "अनुरोधित सामग्री लोड नहीं की जा सकती है। कृपया बाद में पुनः प्रयास करें।" दूसरे शब्दों में, लिंक (इनलाइन सामग्री के अंदर) <a href="http://yahoo.com" ... fancybox से बाध्य नहीं है।

एक ही तरीका है कि fancybox अंदर लिंक (fancybox करने के लिए बाध्य किया जा रहा बिना) काम करते हैं और लोड सामग्री गतिशील रूप से कर सकते हैं जब मौजूदा सामग्री के लिए एक बाहरी html दस्तावेज है और fancybox typeiframe (नहीं अपने मामले)

लिए सेट किया गया दूसरा, तो आप ऐसा fancybox image डिफ़ॉल्ट रूप से करने के लिए type सेट एक छवि खोला है, लेकिन फिर आप एक ही बॉक्स (उदाहरण के लिए याहू) है, जो iframe और अन्य को type स्थापित करने के लिए की आवश्यकता होगी पर सामग्री की एक अलग प्रकार लोड करने के लिए नाटक कर रहे हैं विकल्प width औरजैसे विकल्प।

तीसरा, आप इनलाइन सामग्री का उपयोग कर रहे के बाद से, v1.3.x में एक मौजूदा बग और आगे के मुद्दों से बचने के लिए अपने वैकल्पिक हल के लिए सचेत रहें, you can learn more here

अंतिम, मैं सिर्फ भाषण नहीं कर रहा हूँ यहां, यह आपके मुद्दे के साथ क्या हो रहा है इसकी व्याख्या के बारे में अधिक है .... लेकिन अच्छी खबर यह है कि आपको जिस तरह से काम करना है, उसे बनाने के लिए आपको कोड की कुछ और पंक्तियां जोड़ने की आवश्यकता है:

1: आपको प्रत्येक प्रकार की सामग्री के लिए एक fancybox स्क्रिप्ट बनाने की आवश्यकता है जिसे आप दूसरी बार खोलना चाहते हैं (इसके अतिरिक्त आपके मौजूदा में) , तो आपके उदाहरण में आप fancybox के अंदर छवि को क्लिक करना चाहते हैं और इसे याहू खोलना चाहिए ...तो इस स्क्रिप्ट

$('.fancyframe').fancybox({ 
'type':'iframe', 
'width': 600, //or whatever you want 
'height': 300 
}); 

2 बनाने के लिए: के भीतर अपने छिपा इनलाइन सामग्री लिंक करने के लिए उस वर्ग निर्धारित करते हैं, तो यह कोड:

<div style="display: none;"> 
<div id="hover-image_0"> 
    <a href="http://www.yahoo.com"><img src="1_b.jpg" class="img" /></a> 
</div> 
</div> 

अब

<div style="display: none;"> 
<div id="hover-image_0"> 
    <a class="fancyframe" href="http://www.yahoo.com"><img src="1_b.jpg" class="img" /></a> 
</div> 
</div> 

की तरह भी यही करें दिखना चाहिए प्रत्येक छिपी हुई इनलाइन सामग्री के लिए। यदि आप fancybox में किसी अन्य प्रकार की सामग्री खोलना चाहते हैं, तो तदनुसार एक स्क्रिप्ट बनाएं। अपने कोड के बाकी ठीक है (मुझे परेशान नहीं करता है हॉवर पर fancybox आग)

पक्ष नोट्स: गूगल, याहू, jQuery जैसी साइटों और कुछ अन्य fancybox में नहीं खुलेगा। यह भी सुनिश्चित करें कि आपके पास ठीक से काम करने के लिए fancybox के लिए उचित DOCTYPE है (आपके नमूना पृष्ठ में कोई नहीं है)। स्पष्टीकरण के लिए Unable to load google in iframe in fancybox देखें।

Answer 2

मैं सिर्फ अपने परीक्षण मेरे स्थानीय मशीन पर फिर से बनाया है और यह मेरे लिए ठीक काम करता है (मैं स्थापित FancyBox के डेमो फ़ोल्डर से इस भाग गया):

<html> 
<head> 
<title>jQuery Fancybox Test</title> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js" type="text/javascript"></script> 
<!-- Add fancyBox main JS and CSS files --> 
<script type="text/javascript" src="../source/jquery.fancybox.js"></script> 
<link rel="stylesheet" type="text/css" href="../source/jquery.fancybox.css" media="screen" /> 
</head> 
<body> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".fancybox").fancybox().hover(function() { 
      $(this).click(); 
     }); 
     $("#fancybox-outer").fancybox().mouseleave(function() { 
      $("#fancybox-overlay").click(); 
     }); 
    }); 
</script> 
    <li class="fancybox-outer"><a id="inline" href="#hover-image_0" class="fancybox"> 
     <img src="1_s.jpg" style="margin-top: 32px" /> 
    </a> 
     <p> 
      <a href="http://www.yahoo.com">Go to Yahoo</a></p> 
     <div style="display: none;"> 
      <div id="hover-image_0"> 
       <a href="http://www.yahoo.com"> 
        <img src="1_b.jpg" class="img" /> 
       </a> 
      </div> 
     </div> 
    </li> 
    <li class="fancybox-outer"><a id="inline" href="#hover-image_1" class="fancybox"> 
     <img src="2_s.jpg" style="margin-top: 32px" /> 
    </a> 
     <p> 
      <a href="http://www.google.com">Go to Google</a></p> 
     <div style="display: none;"> 
      <div id="hover-image_1"> 
       <a href="http://www.google.com"> 
        <img src="2_b.jpg" class="img" /></a></div> 
     </div> 
    </li> 
</body> 
</html> 

Answer 3

मुझे लगता है मैं समझ गए होंगे क्या कम से कम मेरे लिए इस मुद्दे का कारण बनता है।

समस्या तब होती है जब आपके पास अपने तत्वों में से एक वर्ग है जो पॉपअप क्लास जैसा ही है।

उदाहरण के लिए:

<a class="popup" href="#">Open the popup</a> 

और तुम एक ही कक्षा नाम के साथ अपने पॉप-अप में कुछ, उदाहरण के लिए है:

<div class="popup">some text</div> 

आप त्रुटि प्राप्त होगी। popup-window जैसे div वर्ग को बदलने का प्रयास करें - जो आपकी त्रुटि

आपके उदाहरण पृष्ठ में, यदि मैं क्लिक नहीं करता तो यह मेरे लिए काम करता है। जब आप क्लिक करते हैं, तो आपको किस पृष्ठ पर ले जाना चाहिए? क्या आप इसे अगली छवि पर जाना चाहते हैं?

मेरी व्यक्तिगत वरीयता में, मुझे होवर पर सक्रियण की परवाह नहीं है। यह वास्तव में भ्रमित हो जाता है, खासकर जब अधिकांश लोग सहज रूप से एक छवि पर क्लिक करते हैं। लेकिन आपके मामले में यह होवर पर खुलता है, फिर वे सहजता से क्लिक करते हैं, तो आपको त्रुटि मिलती है।

क्या आपको यह वही त्रुटि मिलती है जब आप कार्यक्षमता का उपयोग कर रहे हैं क्योंकि यह सामान्य रूप से लागू होता है?

यदि आप चाहते हैं, तो प्रत्येक छवि को गैलरी नाम का उदाहरण दें: rel="gallery" और देखें कि क्या होता है। आपको अगले/पिछड़े तीरों को दिखाना चाहिए और आप की तरह काम करना चाहिए।

लेकिन ईमानदारी से, मैं होवर कार्यक्षमता से पूरी तरह से छुटकारा पाउंगा। या कम से कम माउसआउट से छुटकारा पाएं() शायद यह सबसे परेशान हिस्सा है।

बस fancybox कार्यों कॉल करने के लिए इस का उपयोग करें:

$("a[rel=gallery]").fancybox();

इस तरह आप उन वर्गों है कि शायद समस्या उत्पन्न कर रहा के सभी से छुटकारा मिल सकता है।

मुझे उम्मीद है कि इससे मदद मिलती है।

पहले संयुक्त राष्ट्र ध्यान रखें कि किसी भी fancybox चयनकर्ता की href विशेषता यह इतना लिंक करने के लिए बाध्य से अपनी सामग्री हो जाता है

<a class="fancybox" href="{target}" ... 

fancybox करने के लिए बाध्य किया जाना चाहिए सहन:

Answer 4

मुझे फ़ैंक्सबॉक्स के साथ एक ही समस्या है। आपके पास href और div id में रिक्त स्थान या विशेष वर्ण नहीं हो सकते हैं। यदि आप पृष्ठ शीर्षक का उपयोग कर रहे हैं तो एक यूआरएल स्लग का प्रयोग करें।

Answer 5

मैं अभी भी इस मुद्दे में भाग गया।

जैसा कि यह पता चला है, href url अतिरिक्त केस संवेदनशील है। (यदि यह संभव है)

भले ही डबल, ट्रिपल अपने href urls को यह सुनिश्चित करने के लिए जांचें कि आपके पास सही स्थिति है।

Answer 6

मैं सभी संभावनाओं की जांच कर रहा था और अतिरिक्त मामले संवेदनशीलता मुद्दे में भाग गया क्योंकि @ ब्रेटब्यूमर ने उल्लेख किया था। असल में, यह "इतना मामला संवेदनशील" है, मुझे * .jpg से * .JPG (या जो भी आपकी फ़ाइल प्रकार एक्सटेंशन हो सकता है) से मेरी छवियों के लिए URL (href) पथ को फिर से लिखना था। इस मुद्दे को हल करने में मेरी समस्या हल हो गई।

Answer 7

मेरी समाधान था:

<script type="text/javascript"> 
    jQuery(document).ready(function() { 

     $(".fancybox").click(function() { 
      $.fancybox({ 
       'padding'  : 0, 
       'autoScale'  : false, 
       'transitionIn' : 'none', 
       'titleShow'  : false, 
       'showCloseButton': true, 
       'titlePosition' : 'inside', 
       'transitionOut' : 'none', 
       'title'   : '', 
       'width'   : 640, 
       'height'  : 385, 
       'href'   : this.href, 
       'type'   : 'iframe', 
       'helpers'  : { 
           'overlay' : {'closeClick': false} 
           } 

      }); 

      return false; 
     }); 
    }); 
    </script> 

Answer 8

, अपने LI तत्व को fancybox वर्ग लागू न करें इसे अपने एक तत्व के लिए करते हैं।

Answer 9

छवियों में से कुछ दिखा रहे हैं और अन्य लोगों, नहीं कर रहे हैं, भले ही मार्कअप समान है, तो यह जाँच: फ़ाइल नाम में और html में सभी पत्र लोअरकेस

1. प्रयास करें। फैंक्सबॉक्स काफी मामला संवेदनशील लगता है।
2. जांचें कि छवि में सभी अनुमतियों की अनुमति है या नहीं। मैंने देखा कि मेरी तस्वीरें मोबाइल पर ठीक से काम नहीं करतीं क्योंकि मेरे कंप्यूटर पर, सभी की अनुमति "अनुमति नहीं" पर सेट की गई थी। मैंने इसे "केवल पढ़ने" में बदल दिया और यह एक आकर्षण की तरह काम किया!

Answer 10

मैं उपर्युक्त सलाह लेने के बाद, href में ".png" से ".PNG" बदल गया। ध्यान दें कि फ़ाइल नाम कम केस एक्सटेंशन हैं, लेकिन यह केवल href (शेष फ़ाइल नाम के समान) में ऊपरी केस एक्सटेंशन के साथ काम करता है

आशा है कि इससे मदद मिलती है।