【墨香儿单图】看，谁在诗里画上你.

只道寻常 · 发表于 2022-8-8 10:50:50

想问下香宝这单图里添加的特效代码能免费提供么，
效果杠杠滴，特别有味道~

墨香儿 · 发表于 2022-8-8 14:51:51

青黛发表于 2022-8-8 10:50
想问下香宝这单图里添加的特效代码能免费提供么，
效果杠杠滴，特别有味道~

<html>
      <head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<TITLE></TITLE>

<STYLE type="text/css">
#imageSlideshowHolder{
  /* This is a CSS hack in order to get a nice look in IE 5.5 and lower
  In these versions of Internet Explorer, we need to add borders and padding to the width. In this example, we have a 3 pixel
  border on all sides. This means that the width in IE5.5 should be 606 pixels(600 + border 3px on the left + border 3 px on the right). Height
  should be set to 456 pixels(450 + 3 +3). IE 5.5 will ignore the width attributes below the first line. These will be applied to other browsers.
  */
  /* CSS HACK */
  width: 1300px; /* IE 5.x */
  width/* */:/**/1300px; /* Other browsers */
  width: /**/1300px;

  /* CSS HACK */
  height: 867px; /* IE 5.x */
  height/* */:/**/867px; /* Other browsers */
  height: /**/867px;

  background-color:#FFFFFF;
  border:3px solid #FFFFFF;
  position:relative; /* Never change this value */

}
.imageInGallery{
  width:1300px;
  height:867px;
  background-color:#FFFFFF;

  /* Never change these 3 value */
  left:0px;
  top:0px;
  position:absolute;
}

#imageSlideshowHolder img{
  position:absolute;
}

</style>
<SCRIPT type="text/javascript">


var slideshow2_noFading = false; // Just normal show/hide without fading ?
var slideshow2_timeBetweenSlides = 1500; // Amount of time between each image(1000 = 1 second)
var slideshow2_fadingSpeed = 20; // Speed of fading

/* Don't change any of these values */
var slideshow2_galleryHeigh; // Height of galery
var slideshow2_galleryContainer; // Reference to the gallery div
var slideshow2_galleryWidth; // Width of gallery
var slideshow2_slideIndex = -1; // Index of current image shown
var slideshow2_slideIndexNext = false; // Index of next image shown
var slideshow2_imageDivs = new Array(); // Array of image divs(Created dynamically)
var slideshow2_currentOpacity = 100; // Initial opacity
var slideshow2_imagesInGallery = false; // Number of images in gallery

function getGalleryImageSize(imageIndex)
{
  if(imageIndex==slideshow2_imagesInGallery){
showGallery();
  }else{
var imgObj = document.getElementById('galleryImage' + imageIndex);
var imgWidth = imgObj.width;
var imgHeight = imgObj.height;
if(imgWidth>50){
var tmpDiv = document.createElement('DIV');
tmpDiv.id = 'galleryDiv' + imageIndex;
tmpDiv.style.visibility = 'hidden';
tmpDiv.className='imageInGallery';
slideshow2_galleryContainer.appendChild(tmpDiv);
tmpDiv.appendChild(imgObj);
imgObj.style.left = Math.round((slideshow2_galleryWidth - imgWidth)/2)  + "px";
imgObj.style.top = Math.round((slideshow2_galleryHeight - imgHeight)/2)  + "px";
tmpDiv.style.visibility = 'hidden';
slideshow2_imageDivs.push(tmpDiv);
imageIndex++;
getGalleryImageSize(imageIndex);
}else{
setTimeout('getGalleryImageSize(' + imageIndex + ')',10);
}
  }
}

function showGallery()
{
  if(slideshow2_slideIndex==-1)slideshow2_slideIndex=0; else slideshow2_slideIndex++; // Index of next image to show
  if(slideshow2_slideIndex==slideshow2_imageDivs.length)slideshow2_slideIndex=0;
  slideshow2_slideIndexNext = slideshow2_slideIndex+1; // Index of the next next image
  if(slideshow2_slideIndexNext==slideshow2_imageDivs.length)slideshow2_slideIndexNext = 0;

  slideshow2_currentOpacity=100; // Reset current opacity
  // Displaying image divs
  slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'visible';
  if(navigator.userAgent.indexOf('Opera')<0){
slideshow2_imageDivs[slideshow2_slideIndexNext].style.visibility = 'visible';
  }


  if(document.all){ // IE rules
slideshow2_imageDivs[slideshow2_slideIndex].style.filter = 'alpha(opacity=100)';
slideshow2_imageDivs[slideshow2_slideIndexNext].style.filter = 'alpha(opacity=1)';
  }else{
slideshow2_imageDivs[slideshow2_slideIndex].style.opacity = 0.99; // Can't use 1 and 0 because of screen flickering in FF
slideshow2_imageDivs[slideshow2_slideIndexNext].style.opacity = 0.01;
  }

  setTimeout('revealImage()',slideshow2_timeBetweenSlides);
}

function revealImage()
{
  if(slideshow2_noFading){
slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'hidden';
showGallery();
return;
  }
  slideshow2_currentOpacity--;
  if(document.all){
slideshow2_imageDivs[slideshow2_slideIndex].style.filter = 'alpha(opacity='+slideshow2_currentOpacity+')';
slideshow2_imageDivs[slideshow2_slideIndexNext].style.filter = 'alpha(opacity='+(100-slideshow2_currentOpacity)+')';
  }else{
slideshow2_imageDivs[slideshow2_slideIndex].style.opacity = Math.max(0.01,slideshow2_currentOpacity/100); // Can't use 1 and 0 because of screen flickering in FF
slideshow2_imageDivs[slideshow2_slideIndexNext].style.opacity = Math.min(0.99,(1 - (slideshow2_currentOpacity/100)));
  }
  if(slideshow2_currentOpacity>0){
setTimeout('revealImage()',slideshow2_fadingSpeed);
  }else{
slideshow2_imageDivs[slideshow2_slideIndex].style.visibility = 'hidden';
showGallery();
  }
}

function initImageGallery()
{
  slideshow2_galleryContainer = document.getElementById('imageSlideshowHolder');
  slideshow2_galleryWidth = slideshow2_galleryContainer.clientWidth;
  slideshow2_galleryHeight = slideshow2_galleryContainer.clientHeight;
  galleryImgArray = slideshow2_galleryContainer.getElementsByTagName('IMG');
  for(var no=0;no<galleryImgArray.length;no++){
galleryImgArray[no].id = 'galleryImage' + no;
  }
  slideshow2_imagesInGallery = galleryImgArray.length;
  getGalleryImageSize(0);

}

</SCRIPT>
</head>
<body>
<div id="imageSlideshowHolder">
<img src="http://webftp.bbs.hnol.net/moxianger/特效/特效单图2.jpg">
<img src="http://webftp.bbs.hnol.net/moxianger/特效/特效单图1.jpg">

      <img src="http://webftp.bbs.hnol.net/moxianger/特效/特效单图1.jpg">


<SCRIPT type="text/javascript">
initImageGallery();
</SCRIPT>
</body>
</html>

发你了