2012-07-25 12 views
7

मैं अपनी साइट के नीचे प्लगइन भेजता हूं और भेजता हूं। लेकिन, जब बटन भेजें क्लिक करें, पॉपअप विंडो खुलती है और पूर्ण दिखाई नहीं देती है। मैं पॉपअप को ऊपर कैसे खोल सकता हूं? लेकिन बटन की स्थिति को बदलने और भेजने के लिए नहीं। पॉपअप की केवल स्थिति बदलने के लिए।फेसबुक कैसे बदलें पॉपअप पदों को भेजें?

+0

किसी भी स्क्रीनशॉट या लिंक आप इस जहां कर रहे हैं में से किसी से लिंक की सराहना करेंगे ?? – AlphaMale

+0

मेरे पास एक स्क्रीनशॉट है, लेकिन यहां नहीं रखा जा सकता है, साइट सत्यापन नहीं देते हैं। –

+0

http://www.flickr.com/photos/[email protected]/7642219502/in/photostream –

उत्तर

4

तो आपको visible area में आने तक विजेट पॉपअप बॉक्स को बाईं ओर ले जाने के लिए बाईं ओर से कुछ negative margin जोड़ना होगा। आप अपने सीएसएस में इस का उपयोग कर सकते हैं:

.fb_edge_comment_widget { 
    margin-left: -370px !important; //use any figure appropriate to you 
} 

आप जहां बटन दिखाई तो यह पॉपअप बॉक्स एक सा छोड़ दिया करने के लिए दिखाई देते हैं और पूरी तरह से दिखाई दे रहा है के लिए बाध्य करेगा माता पिता div करने के लिए कुछ margin-bottom जोड़ने की आवश्यकता होगी ... Facebook Like Widget on Fan page, Comment area out of visible area

आशा इस मदद करता है:

यहाँ समान प्रश्न के लिए एक लिंक है।

2

दरअसल, यह संभव है।

हमारा समाधान सिर्फ फेसबुक जैसा संवाद दिखाई देने से अधिक है, यह पूरी तरह से असीमित है, इस प्रकार पृष्ठ के लिए अवरुद्ध नहीं है, यह स्वचालित रूप से सही यूआरएल प्रविष्टि बनाता है ताकि हमारे सभी पृष्ठों में एक ही जावास्क्रिप्ट का उपयोग किया जा सके, और यह अद्यतन करें और इसे वास्तविक आकार के जाने के बाद ही दिखाएं, इस प्रकार एक पत्थर के साथ 3 पक्षियों को मार डालें।

1) हम अपने सभी पृष्ठों में शामिल एक "खाली" div है कि जावास्क्रिप्ट में भर से:
<div id="social-media-bar"><div id="social-media"></div></div>

पुनश्च: div के 2 स्तरों के लिए कारण यह है कि मैं बाद में गूगल + को यह विस्तार होगा, चहचहाना आदि

2) हम एसिंक्रोनस रूप
LazyLoad लोडर, लेकिन किसी भी करना होगा और अगर आप चाहते हैं आप भी तुल्यकालिक कर सकते हैं का उपयोग कर फेसबुक लोड: LazyLoad.js(('https:' == document.location.protocol ? 'https://' : 'http://') +
'connect.facebook.net/en_US/all.js');

3) फेसबुक init में, हम:
- समर्पित div,
भरने - डाला टैग
पार्स करने के लिए अमेरिकन प्लान पूछना - सुनिश्चित करने के लिए प्रदर्शन ताजा कर दिया गया है और इस तरह widht और ऊंचाई सही हैं पार्स करने के बाद समय समाप्त का उपयोग करें।

window.fbAsyncInit = function() { 
     var d = document,n,nn,url,url_ref,i;` 

     // due to bug in facebook need to delay the actual access to data after parse 
     function FBUpdateSize(){ 
      var h,str; 
      // show facebook entry using actual element size 
      h = nn.firstChild.clientHeight; 
      str = h+'px'; 
      nn.style.height= str; 
      n.style.height= str; 
      n.style.overflow='visible'; 
     } 

     FB.init({ channelUrl : 'http://www.plixo.com.sg/channel.html', 
        //appId : '228760567272221', 
        status  : false, 
        xfbml  : false}); 

     // create facebook entries in the DOM 
     n = d.getElementById('social-media'); 
     url = d.URL; 
     i = url.lastIndexOf('/')+1; 
     url_ref = url.slice(i,url.indexOf('.',i)); 
     nn = d.createElement('fb-like'); 
     nn.innerHTML = '<div id="fb_like_bottom"><fb:like href="' + url + '" ref="' + url_ref + '" send="false" layout="standard" width="360px" show_faces="false"></fb:like></div>'; 
     nn = n.appendChild(nn); 

     // call facebook to fill DOM entries 
     // use a timeout in callback to ensure browser has refreshed internal clientHeight 
     FB.XFBML.parse(nn,function(){setTimeout(FBUpdateSize,50)}); 
    };` 

4) और केवल 3 संवाद का स्थान बदलने के लिए समर्पित सीएसएस शैलियों:
#social-media{position:relative;display:block;width:auto;z-index:200;overflow:hidden;height:0;background-color:#f2f2f2;border:1px solid #bdc7d8}
#fb_like_bottom{padding:4px;position:absolute}
#fb_like_bottom .fb_iframe_widget_lift{bottom:0;background-color:#f2f2f2;border:1px solid #bdc7d8!important;margin:-5px;padding:4px}

आप हमारी वेबसाइट पृष्ठों, पूर्व, http://www.plixo.com.sg/large-format-printing-services.html में से किसी में एक उदाहरण देख सकते हैं।

पुन: उपयोग के लिए स्वतंत्र महसूस/आदि को संशोधित, बस यदि आप हमारे पेज ;-)

संबंधित मुद्दे