« »

Hiệu ứng trình diễn ảnh này sẽ mang đến một trong số 17 hiệu ứng chuyển tiếp cho mỗi bức ảnh được xem. Tuy nhiên hiệu ứng chuyển tiếp chỉ hoạt động trên trình duyệt IE, các trình duyệt khác sẽ bị thấy hiệu ứng mờ dần. Bạn có thể thiết lập thông tin mô tả và liên kết cho mỗi bức ảnh.

Nhãn: trình diễn ảnh, mờ dần, ngẫu nhiên, 17, chuyển tiếp, IE, mô tả

Báo cho chúng tôi lỗi JavaScript này

Demo
Phóng to
Tải lại
Cửa sổ mới

Tạo video bằng AI chỉ với giọng nói hoặc văn bản

Ứng dụng video AI MIỄN PHÍ hàng đầu của bạn! Tự động hóa video AI đầu tiên của bạn. Tạo Video Chuyên Nghiệp Của Bạn Trong 5 Phút Bằng AI Không Cần Thiết Bị Hoặc Kỹ Năng Chỉnh Sửa Video. Sản xuất video dễ dàng dành cho nhà tiếp thị nội dung. Ứng dụng video AI KHÔNG GIỚI HẠN miễn phí trong tay bạn

Mã nguồn
CSS
JavaScript
HTML
In

Copy All x2

<style type="text/css">

.flashclass{ /*sample CSS class added to image slideshow container*/
width: 200px; /*a width should be defined for transition to work*/
border: 5px solid orange;
padding: 5px;
}

.flashclass img{
border-width: 0;
}

</style>

Copy All x2

<script type="text/javascript" name="transitionshow.js">

/***********************************************
* Random Transitions Slideshow- by JavaScript Kit (www.javascriptkit.com)
* This notice must stay intact for usage
* Visit JavaScript Kit at http://www.javascriptkit.com/ for full source code
***********************************************/
//Random Transitions Slideshow- By JavaScript Kit (http://www.javascriptkit.com)
//Created: Nov 3rd, 2008

var global_transitions=[ //array of IE transition strings
	"progid:DXImageTransform.Microsoft.Barn()",
	"progid:DXImageTransform.Microsoft.Blinds()",
	"progid:DXImageTransform.Microsoft.CheckerBoard()",
	"progid:DXImageTransform.Microsoft.Fade()",
	"progid:DXImageTransform.Microsoft.GradientWipe()",
	"progid:DXImageTransform.Microsoft.Inset()",
	"progid:DXImageTransform.Microsoft.Iris()",
	"progid:DXImageTransform.Microsoft.Pixelate(maxSquare=15)",
	"progid:DXImageTransform.Microsoft.RadialWipe()",
	"progid:DXImageTransform.Microsoft.RandomBars()",
	"progid:DXImageTransform.Microsoft.RandomDissolve()",
	"progid:DXImageTransform.Microsoft.Slide()",
	"progid:DXImageTransform.Microsoft.Spiral()",
	"progid:DXImageTransform.Microsoft.Stretch()",
	"progid:DXImageTransform.Microsoft.Strips()",
	"progid:DXImageTransform.Microsoft.Wheel()",
	"progid:DXImageTransform.Microsoft.Zigzag()"
]

function flashyslideshow(setting){
	this.wrapperid=setting.wrapperid
	this.imagearray=setting.imagearray
	this.pause=setting.pause
	this.transduration=setting.transduration/1000 //convert from miliseconds to seconds unit to pass into el.filters.play()
	this.currentimg=0
	var preloadimages=[] //temp array to preload images
	for (var i=0; i<this.imagearray.length; i++){
		preloadimages[i]=new Image()
		preloadimages[i].src=this.imagearray[i][0]
	}
	document.write('<div id="'+this.wrapperid+'" class="'+setting.wrapperclass+'"><div id="'+this.wrapperid+'_inner" style="width:100%">'+this.getSlideHTML(this.currentimg)+'</div></div>')
	var effectindex=Math.floor(Math.random()*global_transitions.length) //randomly pick a transition to utilize
	var contentdiv=document.getElementById(this.wrapperid+"_inner")
	if (contentdiv.filters){ //if the filters[] collection is defined on element (only in IE)
		contentdiv.style.filter=global_transitions[effectindex] //define transition on element
		this.pause+=setting.transduration //add transition time to pause
	}
	this.filtersupport=(contentdiv.filters && contentdiv.filters.length>0)? true : false //test if element supports transitions and has one defined
	var slideshow=this
	flashyslideshow.addEvent(contentdiv, function(){slideshow.isMouseover=1}, "mouseover")
	flashyslideshow.addEvent(contentdiv, function(){slideshow.isMouseover=0}, "mouseout")
	setInterval(function(){slideshow.rotate()}, this.pause)
}

flashyslideshow.addEvent=function(target, functionref, tasktype){
	if (target.addEventListener)
		target.addEventListener(tasktype, functionref, false);
	else if (target.attachEvent)
		target.attachEvent('on'+tasktype, function(){return functionref.call(target, window.event)});
},

flashyslideshow.setopacity=function(el, degree){ //sets opacity of an element (FF and non IE browsers only)
	if (typeof el.style.opacity!="undefined")
		el.style.opacity=degree
	else
		el.style.MozOpacity=degree
	el.currentopacity=degree
},

flashyslideshow.prototype.getSlideHTML=function(index){
	var slideHTML=(this.imagearray[index][1])? '<a href="'+this.imagearray[index][1]+'" target="'+this.imagearray[index][2]+'">\n' : '' //hyperlink slide?
	slideHTML+='<img src="'+this.imagearray[index][0]+'" />'
	slideHTML+=(this.imagearray[index][1])? '</a><br />' : '<br />'
	slideHTML+=(this.imagearray[index][3])? this.imagearray[index][3] : '' //text description?
	return slideHTML //return HTML for the slide at the specified index
}

flashyslideshow.prototype.rotate=function(){
	var contentdiv=document.getElementById(this.wrapperid+"_inner")
	if (this.isMouseover){ //if mouse is over slideshow
		return
	}
	this.currentimg=(this.currentimg<this.imagearray.length-1)? this.currentimg+1 : 0
	if (this.filtersupport){
		contentdiv.filters[0].apply()
	}
	else{
		flashyslideshow.setopacity(contentdiv, 0)
	}
	contentdiv.innerHTML=this.getSlideHTML(this.currentimg)
	if (this.filtersupport){
		contentdiv.filters[0].play(this.transduration)
	}
	else{
		contentdiv.fadetimer=setInterval(function(){
			if (contentdiv.currentopacity<1)
				flashyslideshow.setopacity(contentdiv, contentdiv.currentopacity+0.1)
			else
				clearInterval(contentdiv.fadetimer)
		}, 50) //end setInterval
	}
}
/*
     This script downloaded from www.JavaScriptBank.com
     Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
*/
</script>

Copy All x2

<script type="text/javascript">

var flashyshow=new flashyslideshow({ //create instance of slideshow
	wrapperid: "myslideshow", //unique ID for this slideshow
	wrapperclass: "flashclass", //desired CSS class for this slideshow
	imagearray: [
		["http://upload.wikimedia.org/wikipedia/commons/thumb/c/cc/Maceio_Alagoas_Brasil.PNG/180px-Maceio_Alagoas_Brasil.PNG", "http://en.wikipedia.org/wiki/Summer", "_new", "Such a nice Summer getaway."],
		["http://upload.wikimedia.org/wikipedia/commons/thumb/9/95/Windbuchencom.jpg/250px-Windbuchencom.jpg", "http://en.wikipedia.org/wiki/Winter", "", "Winter is nice, as long as there's snow right?"],
		["http://tbn3.google.com/images?q=tbn:RaCzed35eJ1SvM:http://i28.photobucket.com/albums/c250/HoChinhMi/TypicalDutchSpring__byjaaphart-Jaap.jpg", "", "", "Flowers spring back to life in Spring."],
		["http://tbn1.google.com/images?q=tbn:UcU1K0a02oP52M:http://www.autumn-pictures.com/new-jersey-autumn8.jpg", "", "", "Ah the cool breeze of autumn."]
	],
	pause: 2000, //pause between content change (millisec)
	transduration: 1000 //duration of transition (affects only IE users)
})

</script>

Lời bình (0)
Viết

bởi Xem

Hủy phản hồi

Viết lời bình của bạn

Tiêu đề bình luận

Tôi khẳng định 100% là người thực
Tôi lặp lại tôi không phải là công cụ máy

Lượt gửi (0)
Mới

BBCode
HTML
URL
JID

Ứng dụng AI Video.com
Tạo video doanh nghiệp của bạn bằng AI chỉ với giọng nói hoặc văn bản

chatGPTaz.com
Nói chuyện với ChatGPT bằng ngôn ngữ mẹ đẻ của bạn

Ứng dụng AI Video
Ứng dụng video AI MIỄN PHÍ đầu tiên của bạn

Deepfake Video
Deepfake AI Video Maker

Deepfake
Deepfake AI Video Maker

AI Deep Fake
Deepfake AI Video Maker

AIvidio
AI Video Mobile Solutions

AIvideos
AI Video Platform & Solutions

AIvedio
AI Video App Maker

Artificial General Intelligence
Ai and higher level Artificial General Intelligence (AGI)

Artificial General Intelligence
Ai and higher level Artificial General Intelligence (AGI)

Faceswap AI trực tuyến
Đổi mặt Video, Ảnh & GIF ngay lập tức với Công cụ AI mạnh mẽ - Faceswap AI Trực tuyến MIỄN PHÍ

Faceswap AI trực tuyến
Đổi mặt Video, Ảnh & GIF ngay lập tức với Công cụ AI mạnh mẽ - Faceswap AI Trực tuyến MIỄN PHÍ

Faceswap AI trực tuyến
Đổi mặt Video, Ảnh & GIF ngay lập tức với Công cụ AI mạnh mẽ - Faceswap AI Trực tuyến MIỄN PHÍ

Powerful AI Presentation PPT Maker for FREE
Build an impressive presentation with our free online AI presentation app

Your next top AI Assistant
Claude AI, developed by Anthropic

Your next top AI Assistant
Claude AI, developed by Anthropic

Temu tặng $500 cho người dùng mới
Claim Free Temu $500 Credit via Affiliate & Influencer Program

Tín dụng quảng cáo TikTok miễn phí
Làm chủ quảng cáo TikTok cho hoạt động tiếp thị doanh nghiệp của bạn

Dall-E-OpenAI.com
Tự động tạo ra hình ảnh sáng tạo với AI

chatGPT4.win
Nói chuyện với ChatGPT bằng ngôn ngữ mẹ đẻ của bạn

Sản phẩm AI đầu tiên của Elon Musk - Grok/UN.com
Nói chuyện với Grok AI Chatbot bằng ngôn ngữ của bạn

Công cụ.win
Mở trung tâm công cụ miễn phí để mọi người sử dụng với hàng trăm công cụ

GateIO.gomymobi.com
Airdrop miễn phí để nhận, chia sẻ lên đến 150.000 đô la cho mỗi dự án

iPhoneKer.com
Tiết kiệm tới 630$ khi mua iPhone 16 mới

Mua Robot Tesla Optimus
Đặt mua Tesla Bot: Robot Optimus Gen 2 ngay hôm nay với giá dưới 20.000 đô la

Cool Domains for Sale!

AIvideo-app.com javascriptON.com ZWVQ.com pornID.net JavaScriptBank.com gomymobi.com chatGPT4.win gomy.mobi gomymobi.com gomy.mobi ApexBTC.com CTRCoin.com CreditCard.rip hearf.com Dall-E-OpenAI.com chatGPT2.fun XMQV.com eChainBank.com ChatTotal.com lend.services Card.rip index.services CryptoKD.com ABP3.com GrokUN.com MetaTru.com chatGPTaz.com ChainTutor.com system.money AI-Trading-Bot.com war.money

Ngày cập nhật:
Tác giả:
Lượt xem:
Lời bình:
Lượt đánh giá:
Lượt gửi:
Kích thước:
Thứ hạng:

20/02/2010
JavaScript Kit [more]
12,576
0
41
0
8.92 KBytes

JavaScript Trình diễn ảnh mờ dần ngẫu nhiên - Ngôn ngữ: tiếng Việt

3.3/5 41 lượt đánh giá / 12,576 lượt xem / 0 lời bình 20/02/2010 Hiệu ứng trình diễn ảnh này sẽ mang đến một trong số 17 hi...JavaScript Trình diễn ảnh mờ dần ngẫu nhiên - Trình diễn ảnh mờ dần ngẫu nhiên - Ngôn ngữ: tiếng Việt

neellanug minhhhuy_213 biamolongxuyen[3] saudom johnpot[2] nguyenlan113 VOLKERMORD Cao Phong mrD_ntu91[2] hungcuongpt3