社交媒體在彈出

我的社交媒體插件爲我的網站存在問題，問題出在Twitter和Facebook上。 Google+完美運作。社交媒體在彈出

我想讓插件與jQuery中的彈出腳本一起工作。當他們點擊鏈接時，彈出框被添加到主體標籤的末尾。在功能上，我把Facebook，Twitter和Google+的JS代碼，讓div的位置在正確的位置。不是問題是當我第一次點擊彈出窗口（重新加載頁面之後）時，所有插件工作正常。當我關閉彈出並重新打開它。只有Google+（或帶有iFrame的Facebook）正在顯示...

每當我打開彈出窗口時，我會調用這部分社交媒體插件！

   // Google Code 
       (function() { 
        var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; 
        po.src = 'https://apis.google.com/js/plusone.js'; 
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); 
       })(); 
       // Twitter Code 
       !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); 

       if(options.socialLink != false){ 
        var FBsocialLink = 'href='+options.socialLink; 
        var socialLink = 'data-href="'+options.socialLink+'"'; 
       } 
       //show FB 
       $('.popup_container').append('<iframe src="//www.facebook.com/plugins/like.php?'+FBsocialLink+'&amp;send=false&amp;layout=button_count&amp;width=125&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:125px; height:21px;" allowTransparency="true"></iframe>'); 
       //show Google+ 
       $('.popup_container').append('<div class="g-plusone" data-size="medium" '+socialLink+'></div>'); 
       //show Twitter 
       $('.popup_container').append('<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.rednasdesign.nl">Tweet</a>');

有沒有解決這個問題？

來源

2012-02-06 Rednas

由於您在每次彈出窗口打開時插入插件代碼，請務必致電jQuery("#MyDiv").dialog("destroy");。有關更多信息，請參閱http://jqueryui.com/demos/dialog/。

此外，您可能需要設置parsetags至explicit每https://developers.google.com/+/plugins/+1button/並在jQuery對話框的打開事件中調用gapi.plusone.render()。

來源

2012-02-06 17:00:23 DMCS

問題出在用於異步加載的javascript代碼。它可能會在彈出窗口外創建一個腳本標記。在第二次調用時，它檢查這個標記已經存在並且什麼都不做。查找if(!d.getElementById(id))部分。

然而，在你的情況下，異步加載器無論如何都沒有意義，因爲在用戶打開彈出窗口時頁面已經完全加載。

因此，您可以直接包含外部腳本。當彈出窗口再次顯示時，將清除完整的內容，包括那些腳本標記。

var socialLink = e.attr("data-link"); 
var message = e.attr("data-title"); 
var hashtag = e.attr("data-hashtag"); 

var html = '' 
    + '<div class="socialbutton"><iframe src="https://www.facebook.com/plugins/like.php?href='+socialLink+'&amp;send=false&amp;layout=button_count&amp;width=125&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:125px; height:21px;" allowTransparency="true">Loading Facebook</iframe></div>' 
    + '<div class="socialbutton"><div class="g-plusone" data-size="medium" data-href="'+socialLink+'">Loading Google+</div></div>' 
    + '<div class="socialbutton"><a href="https://twitter.com/share" class="twitter-share-button" data-url="' + socialLink + '" data-text="' + message + '" data-hashtags="' + hashtag + '">Loading Twitter</a></div>' 

    + '<div><a href="https://stendhalgame.org/wiki/Two_clicks_for_more_privacy" target="_blank">Two clicks for more privacy.</a></div>' 

    + '<script async type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>' 
    + '<script async type="text/javascript" src="https://platform.twitter.com/widgets.js" id="twitter-wjs"></script>'; 

$('#popupContent').html(html);

打開彈出窗口和完全加載按鈕之間有一點點延遲，特別是在慢速Internet連接上。爲了防止更快的按鈕跳躍，我把它們放到div.elements中，我用CSS定義了24px的固定高度。

來源

2012-02-19 15:20:58

社交媒體在彈出

回答

相關問題