我有以下代码,但我对 jQuery 还是很陌生,我很确定这是可以缩短或使用更少变量来创建更好的动态插件的混乱代码。我正在尝试尝试不同类型的逻辑。这是代码。
$.pluginName = (function () {
$(function () {
var message = "Hello World!";
var animSpeed = 300;
var animType = 'fadeIn';
var icon = "pin";
var btnText = "Purchase";
var btnColor = "pink";
var btnLink = 'http://www.google.com';
var content = '<div id="mn_close" class="light"></div>' + '<div id="mn_border"></div>' + '<i class="icon-' + icon + '"></i>' + '<span class="mn_message">' + message + '</span>' + '<a href="' + btnLink + '" class="button ' + btnColor + '">' + btnText + '</a>';
$("#mn_close").live("click", function () {
$('.mn_bar').animate({
top: '-50'
}, animSpeed, function () {});
});
$(".mn_bar").append(content);
$(function () {
$(".mn_bar").addClass("animated");
$(".mn_bar").addClass(animType);
})
})
})(jQuery);
关于如何将这些变量传递给用户可以从 HTML 源动态更改的选项的任何提示?我不期待详细的答案,但我会很感激传递的任何帮助。
EDI:JS Fiddle 与 CSS 和 HTML。
提前致谢!