निर्दिष्ट वर्ग

Question

के साथ छवियों पर केवल होवर बटन दिखाएं एक ग्राहक साइट पर कुछ छवियों पर होवर पर पिनिट बटन रखना चाहता है। मैंने documentation on Pinterest's site पर देखा और केवल सीएसएस क्लास के साथ कुछ छवियों को बंद करने के विकल्प के साथ, सभी छवियों को पिनिट करने के लिए सेट कर सकता है। लेकिन इसका मतलब यह होगा कि साइट पर सभी छवियों में से 9 5% को नोपिन क्लास होना होगा।

क्या कोई तरीका है कि मैं "pinthis" जैसी छवियों पर कक्षा लागू कर सकता हूं ताकि केवल उन लोगों के पास पिनिट बटन संलग्न हों। मैंने देखा कि आप वर्डप्रेस पर ऐसा कुछ कर सकते हैं लेकिन यह एक कस्टम निर्मित साइट है।

अग्रिम धन्यवाद!

संपादित करें:

इस कोड को मैं शीर्ष लेख टैग में ऊपर Pinterest डेवलपर लिंक में वर्णित के रूप डाल दिया है है:

<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js" data-pin-hover="true"></script> 

यह मूलतः पृष्ठ पर सभी छवियों सेट pinit बटन है, लेकिन मैं उन्हें जरूरत के लिए केवल एक विशिष्ट वर्ग के साथ छवियों पर लागू

Answer 1

तो, jQuery में यह कर का एक तरीका विशेषता है करने के लिए डिफ़ॉल्ट रूप से सभी छवियों को स्थापित करने के लिए, होगा:

data-pin-no-hover="true" 

इस के लिए jQuery बस होगा:

$(".pinit_img").removeAttr("data-pin-no-hover"); 

:

$("img").attr("data-pin-no-hover", true); 

फिर, नीचे आप विशिष्ट वर्ग के लिए गलत पर मान बदलने आप विशेषता निकालना चाहते हैं एक अतिरिक्त पंक्ति हो सकता था

Answer 2

अपने खुद के प्रश्न का उत्तर देने के लिए खेद है, लेकिन इस तरह मैं समस्या से उबर गया। मैंने अभी कुछ जावास्क्रिप्ट लिखा है जो "pinthis" वर्ग वाली छवियों को देखता है और अन्य सभी चीज़ों के लिए विशेषता nopin = "true" लागू करता है।

मैं अभी तक इस उत्तर को नहीं टिकूंगा क्योंकि सब कुछ के लिए nopin = "true" लागू किए बिना ऐसा करने का आधिकारिक तरीका हो सकता है .. लेकिन यह कम और कम संभावना प्रतीत होता है।

व्यक्तिगत रूप से यह Pinterest के हिस्से पर निराशा का एक सा है क्योंकि निश्चित रूप से आपको केवल उन वस्तुओं को बताना चाहिए जो आप चाहते हैं कि वे उन सभी वस्तुओं के माध्यम से अपर्याप्त समय का उपयोग करने के बजाय चाहते हैं जो इसे नहीं चाहते हैं। यह सिर्फ मुझे अपर्याप्त मार्कअप की तरह लगता है।

वैसे भी, यह मैं इसे कैसे किया जाता है:

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("img").each(function(){ 
      if(!$(this).hasClass("pinthis")){ 
       $(this).attr("nopin", "true"); 
      } 
     }); 
    }); 
</script>