！声明文档类型

html lang='en' class='no-js '

头

meta charset='UTF-8' /

meta http-equiv=' X-UA-Compatible ' content=' IE=edge，chrome=1 '

元名称='视口'内容='宽度=设备宽度，初始比例=1.0 '

标题翻转圆形幻灯片/标题

元名称='描述'内容='翻转圆形幻灯片显示'/

meta name=' keywords ' content=' flipping，circle，round，jquery plugin，circle，flipping，3d，css 3d transforms' /

元名称='作者'内容='Codrops' /

链接“rel=”快捷图标href='./favicon.ico '

链接rel='样式表type=' text/CSS ' href=' CSS/default。CSS '/

链接rel='样式表type=' text/CSS ' href=' CSS/component。CSS '/

脚本src=' js/modernizr。习俗。js '/脚本

/head

身体

div class='container '

！-鳕鱼顶杆-

div class='codrops-top clearfix '

a href=' http://sympanus。net/Tutorials/expanding overlayeeffect/' strong laquo；以前的演示：/strong扩展叠加效果/a

span class=' right ' a href=' http://cargo collective .伊萨克蒙特马约尔插图/aa href=' http://sympanus。net/codrops/？p=13951 ' strongBack后退返回Codrops文章/strong/a/span

/div！-/Codrops顶杆-

header class='clearfix '

氕翻转圆形幻灯片显示跨度单击并导航/span/h1

/header

div class='main '

div id=' fc-幻灯片显示class=' fc-幻灯片显示'

ul class=' fc-幻灯片'

Li img src=' images/1。jpg '/h3HOt//李

Li img src=' images/2。jpg '/H3COLd//李

Li img src=' images/3。jpg '/H3light//李

Li img src=' images/4。jpg '/H3 dark//李

Li img src=' images/5。jpg '/H3soft//李

Li img src=' images/6。jpg '/H3hard//李

Li img src=' images/7。jpg '/smooth//李

Li img src=' images/8。jpg '/h3Rough//李

/ul

/div

/div

/div！-/集装箱-

脚本src=' http://Ajax。谷歌api。com/Ajax/libs/jquery/1。9 .0/jquery。量滴js '/脚本

脚本src=' js/jquery。flipshow。js '/脚本

脚本

$(function() {

$(' # fc-幻灯片显示')。flipshow()；

} );

/script

/body

/html