Question

dreamweaver8做网页，焦点图代码怎么放

纯粹菜鸟一枚，完全是为了应付选修作业，找了现成的焦点图代码，自己不知道怎么放，要么不显示，要么只显示乱码。。。。。求大神指点

Answer 1

1.打开软件dreamweaver8写如下代码，如图：

调用CSS样式：<link rel="stylesheet" type="text/css" href="css/style.css" />
调用JS插件代码：<script type="text/javascript" src="js/jquery.js"></script>

<!--效果html开始-->

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript">

$(function(){

var aPage = $('#main .page a'); //分页按钮

var aImg = $('#main .box img'); //图像集合

var iSize = aImg.size(); //图像个数

var index = 0; //切换索引

var t;

$('#btnLeft').click(function(){ //左边按钮点击

index--;

if(index<0){

index=iSize-1

}

change(index)

})

$('#btnRight').click(function(){    //右边按钮点击

index++;

if(index>iSize-1){

index=0

}

change(index)

})

//分页按钮点击

aPage.click(function(){

index = $(this).index();

change(index)

});

//切换过程

function change(index){

aPage.removeClass('active');

aPage.eq(index).addClass('active');

aImg.stop();

//隐藏除了当前元素，所以图像

aImg.eq(index).siblings().animate({

opacity:0

},1000)

//显示当前图像

aImg.eq(index).animate({

opacity:1

},1000)

}

function autoshow() {

index=index+1;

if(index<=iSize-1){

  change(index);

}else{

index=0;

change(index);

}

}

int=setInterval(autoshow,3000);

function clearInt() {

$('#btnLeft,#btnRight,.page a').mouseover(function() {

clearInterval(int);

})

}

function setInt() {

$('#btnLeft,#btnRight,.page a').mouseout(function() {

int=setInterval(autoshow,3000);

})

}

clearInt();

setInt();

})

</script>

<div id="main">

<a class="btnLeft" id="btnLeft" href="javascript:void(0);"></a>

<a class="btnRight" id="btnRight" href="javascript:void(0);"></a>

<div class="box">

<img style="opacity:1;filter:alpha(opacity=100);" src="images/图片名称1.jpg" />

<img src="images/图片名称2.jpg" /> <img src="images/图片名称3.jpg" /> </div>

<div class="page">

<a class="active" href="javascript:void(0);">1</a>

<a href="javascript:void(0);">2</a> <a href="javascript:void(0);">3</a>

</div>

</div>

<!--效果html结束-->

2.最后查看聚焦效果图，如图：

Answer 2

你先布局好一个div，在这个div里面把你下载焦点图代码中的html的div代码粘贴过来。然后js什么的都对应的粘贴过来，改改路径，基本上就ok了

Answer 3

你好，
直接把您的焦点图代码放在一个div里就好了。