cssninjas是一个商业网站,本身就是做网页设计的,因此站点本身也设计的想当不错。
使用到的jQuery插件有:
* jQuery UI 1.6RC2 [Slider + Datepicker]
* sIFR v2.0.7
看代码:
![](https://www.cnblogs.com/Images/OutliningIndicators/ContractedBlock.gif)
Code From cssninjas.com
1![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
/**//*
2
* Scripts
3
*
4
*/
5![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
var Engine =
{
6
// external links
7![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
externalLinks : function()
{
8
$('a[@rel*=external]').attr('target','_blank');
9
},
10
// mails
11![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
secureMails : function()
{
12![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('a[@href^=mailto:]').each(function()
{
13
var mail = $(this).attr('href').replace('mailto:','');
14
var replaced = mail.replace('/at/','@');
15
$(this).attr('href','mailto:'+replaced);
16
if($(this).text() == mail) $(this).text(replaced);
17
});
18
},
19
// headers
20![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
replaceHeaders : function()
{
21![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(typeof sIFR == "function")
{
22![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
sIFR.replaceElement("#content h1.a", named(
{sFlashSrc: "/fonts/claderon.swf", sColor: "#ffffff", sLinkColor: "#ffffff", sHoverColor: "#ffffff", sWmode: "transparent"}));
23![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
sIFR.replaceElement("#content h2.a", named(
{sFlashSrc: "/fonts/claderon.swf", sColor: "#ffffff", sLinkColor: "#ffffff", sHoverColor: "#ffffff", sWmode: "transparent"}));
24![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
sIFR.replaceElement("#content h3.a", named(
{sFlashSrc: "/fonts/claderon.swf", sColor: "#ffffff", sLinkColor: "#ffffff", sHoverColor: "#ffffff", sWmode: "transparent"}));
25
};
26
},
27
// shadow
28![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
headerShadow : function()
{
29
var el = $('#header h2');
30
el.after('<p class="shadow">'+ el.text() +'</p>');
31
},
32
// calculator
33![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
calculator :
{
34![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
init : function()
{
35
this.pages = 1;
36
this.done = false;
37
38
this.base = [];
39
this.subs = [];
40![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
41
this.prices();
42
this.create();
43
this.shortcuts();
44
this.triggers();
45
46
this.containerCurrency.eq(0).trigger('click');
47
},
48
// trigger the calculations and populate fields
49![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
evaluate : function()
{
50
this.calculate();
51
52
this.containerPages.text(this.pages);
53
this.containerTotal.html(this.totalHTML);
54
this.containerOrder.attr('href',this.containerCheckout + '/' + this.pages + '/' + this.abbr);
55
56![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(this.done)
{
57
this.containerFormPrice.html(this.totalHTML);
58
this.containerFormPages.val(this.pages);
59
this.containerFormCurrency.val(this.abbr);
60
}
61
this.done = true;
62
},
63
// grabs the prices from html
64![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
prices : function()
{
65![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#calculator div.data ul li span.additional').each(function(i)
{
66
Engine.calculator.subs[i] = parseInt($(this).html());
67
});
68![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#calculator div.data ul li span.first').each(function(i)
{
69
Engine.calculator.base[i] = parseInt($(this).html()) - Engine.calculator.subs[i];
70
});
71
},
72
// replaces prices with slider
73![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
create : function()
{
74
var code = '';
75
76
code += '<p class="pages">How many pages? <span>1</span></p>' + "\n";
77
code += '<ul class="slider"><li class="less"><a href="#less">-</a></li><li class="drag" id="slider"><span class="holder" id="knob">�</span></li><li class="more"><a href="#more">+</a></li></ul>' + "\n";
78
code += '<div class="wrapper">';
79
code += '<p class="total">Total: <span>0</span></p>';
80
code += '<p class="currency">Change currency: <a href="#EUR" class="euro" title="EUR">€</a> · <a href="#USD" class="dollar" title="USD">$</a> · <a href="#GBP" class="pound" title="GBP">£</a>';
81
code += '</div>' + "\n";
82![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
83
$('#calculator div.data').after(code).remove();
84
},
85
// sets shortcuts
86![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
shortcuts : function()
{
87
// shortcuts
88
this.containerPages = $('#calculator p.pages span');
89
this.containerLess = $('#calculator ul.slider li.less a');
90
this.containerMore = $('#calculator ul.slider li.more a');
91
this.containerCurrency = $('#calculator p.currency a');
92
this.containerTotal = $('#calculator p.total span');
93
this.containerOrder = $('#calculator p.checkout a');
94
this.containerCheckout = this.containerOrder.attr('href');
95
96
this.containerFormPrice = $('#order strong.price');
97
this.containerFormPages = $('#f-pages');
98
this.containerFormCurrency = $('#f-currency');
99
},
100
// calculate the price
101![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
calculate : function()
{
102
var base = this.base[this.currency];
103
var page = this.subs[this.currency];
104
this.total = this.pages * page + base;
105
this.totalHTML = this.sign + '' + '' + this.total;
106
},
107
// add events
108![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
triggers : function()
{
109
110
var parent = this;
111
112
// currency change
113![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
this.containerCurrency.click(function(e)
{
114
parent.currency = $(this).parent().find('a').index(this);
115
parent.sign = $(this).html();
116
parent.abbr = $(this).attr('href').substr($(this).attr('href').indexOf('#')+1);
117
118
$(this)
119
.addClass('active')//.blur()
120
.parent().find('a').not(this).removeClass('active');
121
122
123
parent.evaluate();
124
return false;
125
});
126
127
// less/more
128![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
this.containerLess.click(function()
{
129![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(parent.pages <= 20)
{
130
$('#slider').slider("moveTo","-=1");
131![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
} else
{
132
parent.pages-= 1;
133
parent.evaluate();
134
}
135
return false;
136
});
137![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
this.containerMore.click(function()
{
138![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(parent.pages < 20)
{
139
$('#slider').slider("moveTo","+=1");
140![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
} else
{
141
parent.pages+= 1;
142
parent.evaluate();
143
}
144
return false;
145
});
146
147
// drag
148![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#slider').slider(
{
149
handle : $('#knob'),
150
minValue: 1,
151
maxValue: 20,
152
min: 1,
153
max: 20,
154
stepping: 1,
155
current: 1,
156![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
slide: function(e, ui)
{
157
parent.pages = ui.value;
158
parent.evaluate();
159
}
160
});
161
162
}
163
},
164
// faqs
165![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
answersToggle : function()
{
166
$('dl.faq-a')
167
.find('dd').hide().end()
168
.find('dt').append('<span class="expand">expand</span>')
169![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
.toggle(function()
{
170
$(this)
171
.find('span').attr('class','collapse').html('collapse').end()
172
.next('dd').fadeIn();
173![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
},function()
{
174
$(this)
175
.find('span').attr('class','expand').html('expand').end()
176
.next('dd').fadeOut();
177
});
178
},
179
// delicious link
180![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
deliciousAdd : function()
{
181![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#bookmarks li.delicious a').click(function()
{
182
window.open('http://del.icio.us/post?v=4&noui&jump=close&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title), 'delicious','toolbar=no,width=700,height=400');
183
return false;
184
});
185
},
186
// order form
187![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
order :
{
188![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
init : function()
{
189
this.datepicker();
190
this.change();
191
this.templates();
192
this.validate();
193
},
194![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
datepicker : function()
{
195
196
var d = new Date();
197
var day = d.getDay();
198
var interval = 3;
199
if(day > 2 && day < 7) interval+= 2;
200![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
201
$('#f-deadline')
202![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
.focus(function()
{$(this).val('');})
203![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
.datepicker(
{minDate: interval, beforeShowDay: $.datepicker.noWeekends, showOn: "both", dateFormat: "yy/mm/dd", showAnim: "fadeIn", speed: "fast", buttonImage: "/images/icon-calendar-a.gif", buttonImageOnly: true, hideIfNoPrevNext: true});
204
},
205![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
change : function()
{
206
$('#f-pages')
207
.after('<strong class="price"></strong>')
208![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
.keyup(function()
{
209
var num = parseInt($(this).val());
210![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(num > 0)
{
211![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(num < 20)
{
212
$('#slider').slider("moveTo",num);
213![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
} else
{
214
$('#slider').slider("moveTo",num);
215
Engine.calculator.pages = num;
216
Engine.calculator.evaluate();
217
}
218
}
219![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}).focus(function()
{
220
this.select();
221![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}).blur(function()
{
222
if($(this).val() == '') $(this).val(Engine.calculator.pages);
223
});
224![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#f-currency').change(function()
{
225
var current = $(this).get(0).selectedIndex;
226
Engine.calculator.containerCurrency.eq(current).trigger('click');
227![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
}).keyup(function()
{
228
var current = $(this).get(0).selectedIndex;
229
Engine.calculator.containerCurrency.eq(current).trigger('click');
230
});
231
232
var currency = 1;
233
if ($('#f-currency').get(0)) currency = $('#f-currency').get(0).selectedIndex || currency;
234
var pages = parseInt($('#f-pages').val()) || 1;
235
236
Engine.calculator.containerFormPrice = $('#order strong.price');
237
238
$('#slider').slider("moveTo",pages);
239![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(pages > 20)
{
240
Engine.calculator.pages = pages;
241
Engine.calculator.evaluate();
242
}
243
Engine.calculator.containerCurrency.eq(currency).trigger('click');
244
245
},
246![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
templates : function()
{
247
templates = 1;
248
var cont = $('#f-template').parent();
249
cont.append(' <img src="http://images.cnblogs.com/icon-addfield.gif" width="16" height="16" alt="Add Field" title="Add Field" />')
250![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
cont.find('img').click(function()
{
251
var parent = $(this).parent('p');
252
if(parent.is(':animated')) return false;
253
parent.clone().insertAfter(parent).hide().fadeIn('slow')
254
.find('label').attr('for','template-'+templates).parent()
255
.find('input').attr('id','template-'+templates).val('').parent()
256
.find('img').remove();
257
templates++;
258
$(this).appendTo(parent.next('p'));
259
});
260
},
261![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
validate : function()
{
262
Engine.errors = 0;
263![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#order').submit(function()
{
264
Engine.validation.clear($('#order'));
265
Engine.validation.check($('#f-name'),Engine.validation.required,'Please enter your name');
266
Engine.validation.check($('#f-email'),Engine.validation.email,'Please enter proper email address');
267
Engine.validation.check($('#f-project'),Engine.validation.required,'Please enter project name');
268
Engine.validation.check($('#f-pages'),Engine.validation.required,'Please enter pages count');
269
Engine.validation.check($('#f-notes'),Engine.validation.required,'Please enter project notes');
270
if(Engine.errors !== 0) return false;
271![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$(this).find('button').attr('disabled','disabled').blur().animate(
{ opacity: 0.4 }, 500);
272
});
273
},
274![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
printout : function()
{
275![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#ordered p.print span').wrapInner('<a href="#print"></a>').find('a').click(function()
{
276
window.print();
277
return false;
278
});
279
},
280![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
upload : function()
{
281
282![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#upload-form').submit(function()
{
283
$(this).find('p.submit button')
284
.attr('disabled','disabled')
285![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
.animate(
{opacity: 0.4},500)
286
.blur()
287
.parent().after('<p class="wait">Uploading files
please wait</p>').parent().find('p.wait').fadeIn('slow');
288
$('#template').attr('disabled','disabled');
289
}).find('p.submit')
290
.before('<h3 class="a">Upload Queue</h3><ul class="queue"><li class="empty">No files in queue yet</li></ul>')
291
.find('span').html('Upload Files').end()
292
.parent().find('h2.a').html('Insert your files');
293![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
294![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#template').change(function()
{
295
var path = $(this).val();
296
var file = path.split('\\');
297
file = file[file.length-1];
298
299
var count = $('input.offset[type=file]').size()+1;
300
301
$(this).clone().addClass('offset').attr('id','template-'+count).insertAfter($('input[type=file]:last'));
302
$(this).val('');
303
304![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(count <= 1)
{
305
$(this).parent().parent().find('ul.queue li.empty').remove();
306
}
307![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$(this).parent().parent().find('ul.queue').append('<li>'+ file +' <span>(<a href="#template-'+count+'">remove</a>)</span></li>').find('li:last').fadeIn(500).find('a').click(function(e)
{
308
e.preventDefault();
309
$($(this).attr('href')).remove();
310![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$(this).parents('li').fadeOut(500,function()
{
311
$(this).remove();
312
});
313
});
314
});
315
316
}
317
},
318
// contact form
319![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
contact :
{
320![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
init : function()
{
321
Engine.errors = 0;
322![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#contact').submit(function()
{
323
Engine.validation.clear($('#contact'));
324
Engine.validation.check($('#f-name'),Engine.validation.required,'Please enter your name');
325
Engine.validation.check($('#f-email'),Engine.validation.email,'Please enter proper email address');
326
Engine.validation.check($('#f-subject'),Engine.validation.required,'Please enter subject');
327
Engine.validation.check($('#f-message'),Engine.validation.required,'Please enter your message');
328
if(Engine.errors !== 0) return false;
329![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$(this).find('button').attr('disabled','disabled').blur().animate(
{ opacity: 0.4 }, 500);
330
});
331
332
}
333
},
334
// validation methods
335![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
validation :
{
336![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
clear : function(container)
{
337
Engine.errors = 0;
338
container.find('p.error').remove();
339
},
340![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
check : function(field,rule,message)
{
341![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(rule(field) === false)
{
342
field.parent().after('<p class="error">'+ message +'</p>')
343
Engine.errors++;
344
}
345
},
346![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
required : function(field)
{
347
return !! $(field).val();
348
},
349![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
email : function(field)
{
350
return /^[A-Z0-9._%+\-]+@[A-Z0-9.\-]+\.[A-Z]{2,6}$/i.test($(field).val());
351
}
352
},
353
// testimonials rotate
354![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
testimonials :
{
355![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
init : function()
{
356
if($('#testimonials').size() < 1) return false;
357
358
container = $('#testimonials div.wrap-inner');
359
count = container.find('div.item').size();
360
361
if(count <= 1) return false;
362
363
container.prepend('<ul class="index"><li class="prev"><a href="#prev">Previous testimonial</a></li><li class="next"><a href="#next">Next testimonial</a></li></ul>')
364![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
container.find('ul.index').click(function(e)
{
365
if(container.find('div.item:animated').size() > 0) return false;
366
367![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(e.target.nodeName == 'A')
{
368
visible = container.find('div.item:visible');
369![](https://www.cnblogs.com/Images/OutliningIndicators/InBlock.gif)
370![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(e.target.hash == '#prev')
{
371![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(visible.prev('div.item').size() > 0)
{
372
var next = visible.prev('div.item');
373![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
} else
{
374
var next = container.find('div.item:last');
375
}
376![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
} else if(e.target.hash == '#next')
{
377![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(visible.next('div.item').size() > 0)
{
378
var next = visible.next('div.item');
379![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
} else
{
380
var next = container.find('div.item:first');
381
}
382
}
383
384![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
visible.fadeOut('slow',function()
{
385
next.fadeIn('slow');
386
});
387
//e.target.blur();
388
}
389
return false;
390
});
391
}
392
},
393
// go back link
394![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
goBack : function()
{
395![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('span.go-back').each(function()
{
396![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$(this).wrap('<a href="#back"></a>').click(function()
{
397
history.go(-1)
398
return false;
399
});
400
});
401
}
402
}
403![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
404![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
$(document).ready(function()
{
405
Engine.externalLinks();
406
Engine.secureMails();
407
Engine.answersToggle();
408
Engine.deliciousAdd();
409
Engine.calculator.init();
410
Engine.order.init();
411
Engine.order.printout();
412
if(!$.browser.msie) Engine.order.upload();
413
//Engine.testimonials.init();
414
Engine.contact.init();
415
Engine.replaceHeaders();
416
Engine.headerShadow();
417
Engine.goBack();
418
});
419
document.write('<link rel="stylesheet" type="text/css" media="screen" href="/styles/javascript.css" />');
Notes:
1. 定义一个新的变量来保存本页面相关处理逻辑
1![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
var Engine =
{
2
// external links
3![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
externalLinks : function()
{
4
$('a[@rel*=external]').attr('target','_blank');
5
},
6
}
7![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
调用方式:
1![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
$(document).ready(function()
{
2
Engine.externalLinks();
3
});
4![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
2. 外部链接在新窗口打开
1
// external links
2![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
externalLinks : function()
{
3
$('a[@rel*=external]').attr('target','_blank');
4
}
5![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
3. Email地址保护
1![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
$('a[@href^=mailto:]').each(function()
{
2
var mail = $(this).attr('href').replace('mailto:','');
3
var replaced = mail.replace('/at/','@');
4
$(this).attr('href','mailto:'+replaced);
5
if($(this).text() == mail) $(this).text(replaced);
6
});
7![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
4. sIFR的使用,用于替换header
1
// headers
2![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
replaceHeaders : function()
{
3![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
if(typeof sIFR == "function")
{
4![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
sIFR.replaceElement("#content h1.a", named(
{sFlashSrc: "/fonts/claderon.swf", sColor: "#ffffff", sLinkColor: "#ffffff", sHoverColor: "#ffffff", sWmode: "transparent"}));
5![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
sIFR.replaceElement("#content h2.a", named(
{sFlashSrc: "/fonts/claderon.swf", sColor: "#ffffff", sLinkColor: "#ffffff", sHoverColor: "#ffffff", sWmode: "transparent"}));
6![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
sIFR.replaceElement("#content h3.a", named(
{sFlashSrc: "/fonts/claderon.swf", sColor: "#ffffff", sLinkColor: "#ffffff", sHoverColor: "#ffffff", sWmode: "transparent"}));
7
};
8
}
5. delicious网址保存链接
1
// delicious link
2![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedBlockStart.gif)
deliciousAdd : function()
{
3![](https://www.cnblogs.com/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
$('#bookmarks li.delicious a').click(function()
{
4
window.open('http://del.icio.us/post?v=4&noui&jump=close&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title), 'delicious','toolbar=no,width=700,height=400');
5
return false;
6
});
7
},
8![](https://www.cnblogs.com/Images/OutliningIndicators/None.gif)
6. FAQ条目的显示与隐藏(toggle)
7. jQuery UI slider的使用
8. contact Form的检查