javascript - How to check div visible or not on screen by class name while scrolling? -

नीचे "डेमो डिव" की जांच करें

  & lt; div class = "call" style = "मार्जिन टॉप: 100px;" & gt; नमस्ते & lt; / div & gt; & Lt; div वर्ग = "कॉल" शैली = "मार्जिन-शीर्ष: 900px;" & gt; हैलो & lt; / div & gt;   
 अगर स्क्रीन पर कोई भी उपरोक्त डिवाइट क्लास के नाम से सच निकलता है, स्क्रॉल करते समय मैं नीचे स्क्रिप्ट का उपयोग कर रहा हूं जो हमेशा मुझे सच में वापस लाती है, इसे ठीक कैसे करें?  
  & lt; स्क्रिप्ट & gt; JQuery.expr.filters.offscreen = function (el) {वापसी ((el.offsetLeft + el.offsetwidth) & lt; 0 || (el.offsetop + el.offsetHeight) & lt; 0 || (el.offsetLeft & gt; विंडो .innerWidth || el.offsetTop & gt; विंडो.नरहाइट)); }; $ (विंडो) .scroll (function () {अलर्ट ($ ('। Call')। है (': ऑफस्क्रीन'))}); & Lt; / स्क्रिप्ट & gt;    
 
 
 यह प्रयास करें  
  $ (दस्तावेज़) स्क्रॉल (फ़ंक्शन () (यदि (आईनस्क्रीन ($। कॉल: ईक (0) '))) {// $ ('। Call: eq (0) ') स्क्रीन पर दिखाई दे रहा है}}); // इस समारोह वापसी तत्व वर्तमान में स्क्रीन पर दिखाई दे रहा है या सही / गलत फ़ंक्शन में नहीं हैऑनस्क्रीन (elem) {var docViewTop = $ (window) .scrollTop (); Var docViewBottom = docViewTop + $ (विंडो)। हल्का (); Var elemTop = $ (elem) .offset ()। शीर्ष; Var elemBottom = elemTop + $ (elem)। हाइट (); वापसी ((एल्मबॉटम & lt; = docViewBottom) & amp; amp; एएमएमटीओपी & gt; = docViewTop); }   
 डेमो के लिए  
  & lt; div class = "call" शैली = "मार्जिन-टॉप: 100px;" & gt; नमस्ते & lt; / div & gt; & Lt; label class = "label1" शैली = "मार्जिन-शीर्ष: 500px;" & gt; & Lt; / लेबल & gt; & Lt; label class = "label2" शैली = "मार्जिन-शीर्ष: 20px;" & gt; & Lt; / लेबल & gt; & Lt; div वर्ग = "कॉल" शैली = "मार्जिन-शीर्ष: 500px;" & gt; हैलो & lt; / div & gt; & Lt; स्क्रिप्ट प्रकार = "टेक्स्ट / जावास्क्रिप्ट" & gt; $ (दस्तावेज़) .scroll (function () {if (isOnScreen ($ ('। Call: eq (0)'))) {$ ('। Label1')। पाठ ('first div show') // अगर पहले कॉल (क्लास डिवी) में दिखने वाले संदेश डिस्प्ले में दिखता है} अन्य {$ ('। लेबल 1')। पाठ ('प्रथम छिपाएँ')} अगर (आईओएसस्क्रीन ($ ('। Call: eq (1)'))) {$ ( '.label2')। पाठ ('द्वितीय डिवि शो') // यदि दूसरा कॉल क्लास डिवीबल दिखता है तो msg लायबिल में दिखाया जाता है} अन्य {$ ('। लेबल 2')। पाठ ('दूसरा भाग छिपाना')}}); फ़ंक्शन isOnScreen (elem) {var docViewTop = $ (विंडो) .scrollTop (); Var docViewBottom = docViewTop + $ (विंडो)। हल्का (); Var elemTop = $ (elem) .offset ()। शीर्ष; Var elemBottom = elemTop + $ (elem)। हाइट (); वापसी ((एल्मबॉटम & lt; = docViewBottom) & amp; amp; एएमएमटीओपी & gt; = docViewTop); } & Lt; / script & gt;