tutorial - uses of html




अगर छवि नहीं मिली है तो एचटीएमएल (8)

मेरे पास एक HTML पृष्ठ में एक छवि है:

<img src="smiley.gif" alt="Smiley face" width="32" height="32" />

अगर सर्वर सर्वर पर नहीं मिली है तो यह एक बदसूरत खाली वर्ग दिखाता है।

मैं इसे बनाना चाहता हूं ताकि अगर कोई छवि नहीं मिली तो यह कुछ भी नहीं दिखाएगा या कुछ अन्य डिफ़ॉल्ट छवि जो मुझे पता है निश्चित रूप से सर्वर पर है।

यह कैसे किया जा सकता है?


अपनी समस्या का समाधान करने का सबसे अच्छा तरीका:

<img id="currentPhoto" src="SomeImage.jpg" onerror="this.src='Default.jpg'" alt="" width="100" height="120">

onerror लिए एक अच्छी बात है :)

बस छवि फ़ाइल नाम बदलें और स्वयं को आजमाएं।


आप alt जोड़कर एक वैकल्पिक पाठ दिखा सकते हैं:

<img src="my_img.png" alt="alternative text" border="0" /> 

ठीक है आप इसे आजमा सकते हैं।

  <object data="URL_TO_Default_img.png" type="image/png">
   <img src="your_original_image.png" />
  </object>

यह मेरे लिए काम किया। मुझे तुम्हारे बारे में बताएं।


ठीक है, लेकिन मैं इस तरह से उपयोग करना पसंद करता हूं, ताकि जब भी मूल छवि उपलब्ध न हो, तो आप अपनी डिफ़ॉल्ट छवि लोड कर सकते हैं जो आपकी पसंदीदा स्माइली या छवि कह सकती है क्षमा करें! उपलब्ध नहीं है, लेकिन अगर दोनों छवियां गायब हैं तो आप प्रदर्शित करने के लिए टेक्स्ट का उपयोग कर सकते हैं। जहां आप तब भी स्माइली कर सकते हैं। एक नजर में लगभग हर मामले को शामिल किया गया है।

<img src="path_to_original_img/img.png"  alt="Sorry! Image not available at this time" 
       onError="this.onerror=null;this.src='<?=base_url()?>assets1/img/default.jpg';">

मैं <img> टैग द्वारा कब्जा कर लिया गया स्थान छुपाना चाहता था इसलिए यह मेरे लिए काम करता था

<img src = "source.jpg" alt = "" >


मैंने छवि के चारों ओर एक पैरेंट div जोड़ा और मूल छवि को छिपाने के लिए निम्नलिखित आतंक घटना हैंडलर का उपयोग किया क्योंकि आईई में अभी भी एक बदसूरत छवि-नहीं मिली छवि थी जो alt विशेषता का उपयोग करने के बाद दिखाया गया था:

<div style=" width:300px; height:150px; float:left; margin-left:5px; margin-top:50px;">
        <img src='@Url.Content("~/Images/Logo-Left.png")' onerror="this.parentElement.innerHTML = '';" />
</div>

यह मेरे लिए काम करता है कि अगर आप छवि तोड़ने पर alt विशेषता का उपयोग नहीं करना चाहते हैं तो आप कोड के इस टुकड़े का उपयोग कर सकते हैं और तदनुसार सेट कर सकते हैं।

<h1>
  <a> 
   <object data="~/img/Logo.jpg" type="image/png">
     Your Custom Text Here
   </object>
  </a>
</h1>

यह मेरे लिए काम किया। srcset का उपयोग कर। मैंने अभी इसके बारे में सीखा है इसलिए मुझे नहीं पता कि ब्राउज़र इसका समर्थन करते हैं लेकिन यह मेरे लिए काम करता है। इसे आज़माएं और बाद में मुझे अपनी फीड वापस दें।

 <img src="smiley.gif" srcset="alternatve.gif" width="32" height="32" />




html