2011-11-09 25 views
1
(function($){ 

$.fn.facebookTrafficPop = function(options){ 

     /* Setup the options for the tooltip that can be 
      accessed from outside the plugin    */ 
     var defaults = { 
      title: "Your Popup Title", 
      message: "Your popup/call to action message!", 
      url: "http://tyler.tc", 
      showfaces: true, 
      timeout: 25, 
      closeable: true, 
      wait: 0, 
      lang: "en" 
     }; 

     // Extend options and apply defaults if they are not set 
     var options = $.extend(defaults, options); 

     /* NEW In Version 1.4 - Localization 
      Setup the localzation strings, add your own if needed    */ 
     var tstrings = { 

      // This is your wait text i.e. '{or wait} xx seconds' 
      orwait: { 
       en: "Or wait", 
       fr: "Ou attendre", 
       de: "Order warten", 
       it: "O attendere", 
       es: "O esperar" 
      }, 

      // seconds string 
      seconds: { 
       en: "Seconds", 
       fr: "Secondes", 
       de: "Sekunden", 
       it: "Secondi", 
       es: "Segundos" 
      }, 

      closeable: { 
       en: "Close", 
       fr: "Fermer", 
       de: "Nähe", 
       it: "Chiudi", 
       es: "Cerrar" 
      } 

     } 

     /* Create a function that builds the popup html 
      markup. Then, prepend the popup to the body */ 
     getPopHTML = function() { 

      var tPop = '<div id="fblikebg"></div><div id="fblikepop"><div id="popup_head"><div id="closeable"></div><h1>'+defaults.title+'</h1></div><div id="popupMessage">'+defaults.message+'</div><div id="buttonArea"><div id="actionHolder"><fb:like id="fbLikeButton" href="'+defaults.url+'" show_faces="'+defaults.showfaces+'" width="450"></fb:like></div><div id="counter-display">'+tstrings.orwait[defaults.lang]+' <span id="counter"> </span> '+tstrings.seconds[defaults.lang]+'.</div> <div style="clear:both"></div></div></div></div>' 

      // Return the pop up markup 
      return tPop; 

     } 

     // Create a variable to hold the markup (Needed For I.E 8 6 + 7) 
     var markup = getPopHTML(); 

     // Prepend the popup into the body of the page 
     $('#fbtpdiv').html(markup); 

     // Get cookie to see if they already clicked like 
     var cook = readCookie('fblikepop'); 

     // Get wait cookie 
     var waitCook = readCookie('fblikepopwait'); 

     // Only show the pop up if the user has not clicked like already 
     if(cook != 'true' && waitCook != 'true'){ 

      // Get window width and height to center the pop up 
      var windowWidth = document.documentElement.clientWidth; 
      var windowHeight = document.documentElement.clientHeight; 
      var popupHeight = $("#fblikepop").height(); 
      var popupWidth = $("#fblikepop").width(); 

      // Simple division will let us make sure the box is centered on all screen resolutions 
      $("#fblikepop").css({"position": "absolute","top": windowHeight/2 - popupHeight/2,"left": windowWidth/2-popupWidth/2}); 
      $("#fblikebg").css({"height": windowHeight}); 

      // Check if the closeable is set to true 
      if(defaults.closeable == true){ 

       // If so, display a close button for the pop up 
       $("#closeable").html('<a id="#fbflush" class="fbflush" onClick="fbLikeDump();" href="#">'+tstrings.closeable[defaults.lang]+' x</a>'); 

      } 

      // Set the background shadow active - higher opactity = darker background shadow 
      $("#fblikebg").css({"opacity": "0.2"}); 

      // Fade in the background shadow 
      $("#fblikebg").fadeIn("slow"); 

      // Fade in the popup box 
      $("#fblikepop").fadeIn("slow"); 

      // Initiate the timer (more documentation on the countdown timer here: http://keith-wood.name/countdownRef.html) 
      $('#counter').countdown({until: '+'+defaults.timeout+'s', format: 'S', compact: true, description: '', onExpiry: fbLikeDump}); 

      // Check if the script should wait between popups 
      if(defaults.wait != 0){ 

       // If so, set the wait cookie so it does not constantly pop up 
       createWait('fblikepopwait', 'true', defaults.wait); 

      } 

      // Final parse check to ensure Like button appears on all browsers of all speeds 
      FB.XFBML.parse(); 

     } // End if 

}; // End Main Function 

})(jQuery); // End Plugin 

// This is our listener to check wether or not the user clicks the like button. 
FB.Event.subscribe('edge.create', function(href) { 

// If they did, close the pop up 
fbLikeDump(true); 

}); 

// function to remove the pop up from the screen 
function fbLikeDump(action){ 

// Check if the user completed the like or if the timer ran out 
if(action == true){ 

// Create the cookie to remember the user clicked like, 30 is the number of days it will expire in. 
createCookie('fblikepop', 'true', 30); 

} // End if 

// Fade out the background shadow 
$("#fblikebg").fadeOut("slow"); 

// Fade out the pop up itself 
$("#fblikepop").fadeOut("slow"); 

} 

这是发生错误:这个基于jQuery的Facebook弹出窗口有什么问题?

enter image description here

回答

0

你很可能缺少的jQuery的参考。

+0

是的,我已经得到了很多:) –

+0

也许jQuery在你的插件后加载?你的应用中是否有其他的东西使用jQuery? – jrummell

+0

其实这是一个wordpress插件..所以一些其他插件可以使用jQuery。然而,我粘贴的错误快照是一个孤立的案例。即错误是单独生成的,而不是在将此代码用作wordpress中的插件时。 –

0

你确定你正在加载jQuery吗?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script> 

检查的jQuery脚本标签是你的<head>标签内,而它实际上是加载(与Chrome开发者工具)。

+0

这实际上工作..谢谢一堆..我想给你一个大拇指,但我的声誉是如此之低我不能:(原谅我的 –

+1

没问题。如果它解决了你的问题,接受答案。 –