在哪裏添加社交共享代碼從提供的jsfiddle到fancybox

這是一個非常非常基本的問題，因爲我是Javascript和Jquery的全新品牌，但我似乎無法在任何地方找到答案。在哪裏添加社交共享代碼從提供的jsfiddle到fancybox

我試圖在我們的網站上的一個頁面上實現FancyBox，包括由FancyBox提示和技巧提供的額外社交分享按鈕。

這裏就是我有這麼遠（沒有社會共享還），我喜歡它： http://www.aatg.org/default.asp?page=Testpageja

的問題是我想不通的地方，爲社會共享按鈕添加代碼到提供的jquery.fancybox.js文件。我太新了，無法弄清楚函數應該在哪裏。我已經在JSFiddle中找到了它，所以它的工作原理，我只是不知道現在放在我的網站上，所以它的功能。

下面是我想出中的jsfiddle：http://jsfiddle.net/G5TC3/3186/

$(".fancybox") 
.attr('rel', 'gallery') 
.fancybox({ 
    beforeShow: function() { 
     if (this.title) { 
      // New line 
      this.title += '<br />'; 

      // Add tweet button 
      this.title += '<a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-url="' + this.href + '">Tweet</a> '; 

      // Add FaceBook like button 
      this.title += '<iframe src="//www.facebook.com/plugins/share_button.php?href=' + this.href + '&amp;layout=button_count&amp;show_faces=true&amp;width=500&amp;action=like&amp;font&amp;colorscheme=light&amp;height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:23px;" allowTransparency="true"></iframe>'; 
     } 
    }, 
    afterShow: function() { 
     // Render tweet button 
     twttr.widgets.load(); 
    }, 
    helpers : { 
     title : { 
      type: 'inside' 
     } 
    } 
});

誰能幫告訴我在哪裏，這需要在jquery.fancybox.js文件去（從下載的的fancybox ）。也許我錯了，上面的代碼需要進入jquery.fancybox.pack.js？（注意：現在FB共享不是像按鈕一樣，但這就是我想要的）。

非常感謝您幫助noob退出。

來源

2015-02-11 user2697568

您提供的網頁，你就行469初始化的fancybox：

<script type="text/javascript"> 
    $(document).ready(function() { 
    $(".fancybox").fancybox(); 
    }); 
</script>

所以你也可以從小提琴腳本替換線$(".fancybox").fancybox();，它應該工作。
基本上，您不會添加代碼來將插件初始化爲插件文件本身，但可以將其作爲內聯腳本添加到您的HTML中（如您已經完成的那樣），也可以將其添加到您包含在單獨的腳本文件中你的頁面可以更好地維護可用性。

請注意，你的頁面是無效的HTML - 你有兩個額外的head和body標籤，你應該刪除 - 第二head標籤是符合446：

<div id="CustomPageBody"><head>

和關閉線452第二body標記是第454行，並在初始化fancybox的腳本下面的第464行關閉。

來源

2015-02-11 21:02:48

非常感謝，非常感謝！我絕對忽視了那個地方 - 我完全按照你的要求做了，不幸的是，現在正在加載圖片，好像fancyBox沒有被調用，圖片只是在頁面中加載。 – user2697568 2015-02-11 21:16:44

@ user2697568我剛剛檢查了更新後的頁面 - 你錯過了關閉'}）;''$（document）.ready（function（）{'。注意，目前你有2個腳本錯誤 - SyntaxError ：在函數體'後面的479行缺少}你應該添加這個'}）;'。第二個錯誤 - 「TypeError：$（...）。autocomplete不是函數」可能是相關的，但是首先爲fancybox添加缺失的括號。 – 2015-02-11 21:28:17

非常感謝馬提亞！我只是改變了它，它已經修復了！看起來像Twitter小部件圖像沒有加載，但這是我可以自己弄清楚的。你幫了我很多，謝謝！ – user2697568 2015-02-11 21:30:42

在哪裏添加社交共享代碼從提供的jsfiddle到fancybox

回答

相關問題