HTML5和jQuery是現代網頁開發中非常重要的技術。它們為網頁增添了豐富的動態特效，同時也提升了用戶使用體驗。接下來，我們就來介紹一些使用HTML5和jQuery編寫的特效代碼。 首先，我們來看一下一個基于HTML5 canvas元素的動態背景特效代碼。這個特效代碼可以讓網頁背景隨機產生彩色粒子，給用戶帶來非常獨特的感覺。代碼如下：

var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext('2d');
var W = window.innerWidth;
var H = window.innerHeight;
canvas.width = W;
canvas.height = H;
var particles = [];
for(var i = 0; i< 50; i++)
{
particles.push(new create_particle());
}
function create_particle()
{
this.x = Math.random()*W;
this.y = Math.random()*H;
this.vx = Math.random()*20-10;
this.vy = Math.random()*20-10;
this.radius = Math.random()*20+5;
}
function draw()
{
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.globalCompositeOperation = "lighter";
for(var i = 0; i< particles.length; i++)
{
var p = particles[i];
ctx.beginPath();
ctx.fillStyle = "rgba(255,255,255,0.5)";
ctx.arc(p.x, p.y, p.radius, 0, Math.PI*2, false);
ctx.fill();
p.x += p.vx;
p.y += p.vy;
if(p.x< -50) p.x = W+50;
if(p.y< -50) p.y = H+50;
if(p.x >W+50) p.x = -50;
if(p.y >H+50) p.y = -50;
}
}
setInterval(draw, 30);

其次，我們來看一個基于jQuery的照片輪播特效代碼。這個特效代碼可以讓網頁中的照片輪流展示，并且有過渡特效。代碼如下：

var slideIndex = 0;
showSlides();
function showSlides() {
var i;
var slides = $(".mySlides");
for (i = 0; i< slides.length; i++) {
slides.eq(i).hide();
}
slideIndex++;
if (slideIndex>slides.length) {slideIndex = 1}
slides.eq(slideIndex-1).fadeIn(1000);
setTimeout(showSlides, 3000); // Change image every 3 seconds
}

以上就是兩個簡單的HTML5和jQuery特效代碼。它們都可以讓網頁增加動態效果，提升用戶體驗。希望對大家有幫助。