Fri

20

Mar

2009

90、在页面中画线

90、在页面中画线

脚本说明:

把如下代码加入<body>区域中

<script>

var winW= document.body.clientWidth;

var winH= document.body.clientHeight;

var MyStr="<object id=DDraw classid=\"clsid:369303C2-D7AC-11d0-89D5-00A0C90833E6\"";

MyStr+=" style=\"position:absolute;left:0;top:0;width:";

MyStr+=winW;

MyStr+=";height:";

MyStr+=winH;

MyStr+="\"></object>";

document.write(MyStr);

</script>

<script language=javascript>

var IsClick=0;

var MouseX0=0;

var MouseY0=0;

function MyDraw(){

if (IsClick) {

if ((MouseX0==0)&&(MouseY0==0)){

MouseX0=event.clientX-winW/2;

MouseY0=event.clientY-winH/2;

}

MouseX=event.clientX-winW/2;

MouseY=event.clientY-winH/2;

var Canvas=DDraw.DrawSurface;

var Lib=DDraw.Library;

Canvas.FillColor(Lib.red);

Canvas.Line(MouseX0,MouseY0,MouseX,MouseY);

DDraw.DrawSurface=Canvas;

MouseX0=MouseX;

MouseY0=MouseY;

}

}

 

function MyClick(){

IsClick=!IsClick;

MouseX0=event.clientX-winW/2;

MouseY0=event.clientY-winH/2;

}

 

document.onclick=MyClick;

document.onmousemove=MyDraw;

</script>

 

0 Comments

Fri

20

Mar

2009

89、CSS使用大全

89CSS使用大全

脚本说明:

把如下代码加入<body>区域中

<style>

IMG {border:2px solid black}

BODY{

margin:0;

background:white;

font-family:verdana;

font-size:80%;

}

.bar{

background:#336699;

width:100%;

height:30px;

border-top:1px solid #99CCFF;

border-bottom:1px solid #000000;

}

.desbar{

background:#FFFFFF;

width:100%;

padding: 10px;

border-top:1px solid #CCCCCC;

border-bottom:1px solid #000000;

color:black;

font-size:8pt;

}

.title{

font-size:15pt;

color:white;

padding-left:10px;

}

PRE { margin:0}

 

a:link

{

text-decoration:none;

color:white

}

a:visited

{

text-decoration:none;

color:white

}

a:active

{

text-decoration:none;

color:white

}

a:hover

{

text-decoration:none;

color:yellow

}

SELECT { font-size:9pt; border:2px; }

</style>

<SCRIPT LANGUAGE="javascript">

var browserCapable = true;    // Prevents errors on downlevel browsers

var startImage = "200204047.gif";     // /workshop/graphics/

var endImage = "200204048.gif";

var featuresHeader = "<B>Features:</B><BR>"

var sSinQut ="'";

var sRandomBarsOrientationText="";

 

function copy2Clipboard()

{

  // Copy displayed code to user's clipboard.

  var textRange = document.body.createTextRange();

  textRange.moveToElementText(oCodeSpan);

  textRange.execCommand("Copy");

}

 

function highlightText(whatToHighlight) {

  var oRng = document.body.createTextRange();

  oRng.moveToElementText(oCodePre);

  oRng.execCommand("RemoveFormat");

  var oHL = document.body.createTextRange();

  oHL.moveToElementText(oCodePre);

  oHL.findText(whatToHighlight);

  oHL.execCommand("Bold");

}

 

function switchContent(obj) {

    oContentHolder.innerHTML=obj.innerHTML;

    oImg.src=startImage;

    if (obj==filterSection){

        changeFilter();

        updateFilterCode();

    }

    else {

           imgObjText.innerHTML = "<BR><b>First Page</b><BR><BR>Using the <B>apply</B> method prepares this SPAN element for content changes.";

        changeTrans();

        updateTransCode();

    }

}

 

function getControlObject(controlName) {

    var obj=null;   

 

   for (x=0; x < document.all(controlName).length; x++) {

       objTemp = document.all(controlName,x);

       if (objTemp.parentElement.isSource==null) {

           obj=objTemp;

       }

    }

    return(obj);

}

 

function disableControlObject(controlName) {

 

   for (x=0; x < document.all(controlName).length; x++) {

      document.all(controlName,x).disabled=true;

    }

}

 

function enableControlObject(controlName) {

 

   for (x=0; x < document.all(controlName).length; x++) {

      document.all(controlName,x).disabled=false;

    }

}

 

function changeFilter() {

    var selectObject = getControlObject("oSelect");

    var selectedValue = selectObject.options[selectObject.selectedIndex].value;

    var transitionAsFilter = selectObject.options[selectObject.selectedIndex].TRANS;

 

    imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";

    imgObj.style.backgroundColor='skyblue';

    imgObj.style.color='darkred';

    if (selectedValue != "empty") {

        if (selectedValue.indexOf('AlphaImageLoader')!=-1) {

            oControlsSpan.innerHTML = oAlphaImageLoaderControls.innerHTML;

        alphaImageLoaderFilterChange();

        }

        else if (selectedValue.indexOf('Blur')!=-1) {

            imgObj.style.backgroundColor='';       

            imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";

            oControlsSpan.innerHTML = oBlurControls.innerHTML;

            blurFilterChange();

        }

        else if (selectedValue.indexOf('Alpha')!=-1) {

            oControlsSpan.innerHTML = oAlphaControls.innerHTML;

        alphaFilterChange();

        }

        else if (selectedValue.indexOf('Emboss')!=-1) {

            oControlsSpan.innerHTML = "";

            embossFilterChange();

        }

        else if (selectedValue.indexOf('Engrave')!=-1) {

            oControlsSpan.innerHTML = "";

            engraveFilterChange();

        }

        else if (selectedValue.indexOf('Pixelate')!=-1) {

            oControlsSpan.innerHTML = oPixelateFilterControls.innerHTML;

            pixelateFilterChange();

        }

        else if (selectedValue.indexOf('DropShadow')!=-1) {

            imgObj.style.backgroundColor='';       

            imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";

            oControlsSpan.innerHTML = oDropShadowControls.innerHTML;

            dropShadowFilterChange();

        }

        else if (selectedValue.indexOf('Chroma')!=-1) {

            oControlsSpan.innerHTML = oChromaControls.innerHTML;

            chromaFilterChange();

        }

        else if (selectedValue.indexOf('BasicImage')!=-1) {

            oControlsSpan.innerHTML = oBasicImageControls.innerHTML;

            basicImageFilterChange();

        }

        else {

            imgObj.style.filter=selectedValue;

            oControlsSpan.innerHTML = '';

        }

        if (oControlsSpan.innerHTML!='') {

            oControlsSpan.innerHTML = featuresHeader + oControlsSpan.innerHTML;

        }

        if (transitionAsFilter == "TRUE") {

            oControlsSpan.innerHTML = oControlsSpan.innerHTML + oGlobalControls.innerHTML;

            progressChange();

        }

    }

    else {

            imgObj.style.filter='';

            oControlsSpan.innerHTML = featuresHeader + 'No filter is currently selected.';

    }

    updateFilterCode();      

}

 

function updateFilterCode() {

    oCodePre.innerText=imgObj.outerHTML;

}

 

function alphaFilterChange(){

    var cmd;

    var controlObject = getControlObject("styleList");

    var style = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("opacityList");

    var opacity = controlObject.options[controlObject.selectedIndex].value;

 

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Alpha( " ;

    cmd  = cmd + "style=" + style + ",opacity=" + opacity ;

 

    if (style!=0){

        controlObject = getControlObject("finishOpacityList");

        enableControlObject("finishOpacityList");

        var finishOpacity = controlObject.options[controlObject.selectedIndex].value;

       

        cmd  = cmd + ",finishOpacity=" + finishOpacity ;

 

        if (style==1){

            controlObject = getControlObject("startXList");

            enableControlObject("startXList");

            var startX = controlObject.options[controlObject.selectedIndex].value;

            controlObject = getControlObject("finishXList");

            enableControlObject("finishXList");

            var finishX = controlObject.options[controlObject.selectedIndex].value;

 

            controlObject = getControlObject("startYList");

            enableControlObject("startYList");

            var startY = controlObject.options[controlObject.selectedIndex].value;

            controlObject = getControlObject("finishYList");

            enableControlObject("finishYList");

            var finishY = controlObject.options[controlObject.selectedIndex].value;

 

            cmd  = cmd + ",startX=" + startX + ",finishX=" + finishX ;

            cmd  = cmd + ",startY=" + startY + ",finishY=" + finishY;

        }

        else{

            disableControlObject("startXList");

            disableControlObject("finishXList");

            disableControlObject("startYList");

            disableControlObject("finishYList");

        }

       

    }

    else{

        disableControlObject("finishOpacityList");

        disableControlObject("startXList");

        disableControlObject("finishXList");

        disableControlObject("startYList");

        disableControlObject("finishYList");

    }

  

    cmd  = cmd + ")'";

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

function alphaImageLoaderFilterChange(){

    var cmd;

    var controlObject = getControlObject("srcList");

    var src = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("sizingMethodList");

    var sizingmethod = controlObject.options[controlObject.selectedIndex].value;

 

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.AlphaImageLoader( " ;

    cmd  = cmd + "src="  + src + ", sizingmethod=" + sizingmethod + ")'";

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

function basicImageFilterChange(){

    var cmd;

    var controlObject = getControlObject("rotationList");

    var rotation = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("mirrorSwitch");

    controlObject.checked==true ? mirror = 1 : mirror = 0

    controlObject = getControlObject("invertSwitch");

    controlObject.checked==true ? invert = 1 : invert = 0

    controlObject = getControlObject("xraySwitch");

    controlObject.checked==true ? xray = 1 : xray = 0

    controlObject = getControlObject("grayscaleSwitch");

    controlObject.checked==true ? grayscale = 1 : grayscale = 0

    controlObject = getControlObject("basicImageOpacityList");

    var opacity = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.BasicImage( Rotation="+ rotation +",Mirror=" + mirror + ",Invert=" + invert + ",XRay=" + xray + ",Grayscale=" + grayscale + ",Opacity=" + opacity;

    cmd = cmd + ")'";

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

 

function blurFilterChange(){

    var controlObject = getControlObject("pixelRadiusList");

    var pixelRadius = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("makeShadowSwitch");

    var makeShadow = controlObject.checked;

    var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Blur( PixelRadius="+ pixelRadius +"," + "MakeShadow=" + makeShadow;    

    if (makeShadow){

 

           controlObject = getControlObject("shadowOpacityList");

           enableControlObject("shadowOpacityList");

           var shadowOpacity = controlObject.options[controlObject.selectedIndex].value;

 

        cmd  = cmd  + ",ShadowOpacity=" + shadowOpacity +")'";

 

    }

    else{

        disableControlObject("shadowOpacityList");

        cmd  = cmd  +")'";

 

    }

    eval(cmd);

 

    updateFilterCode();

    highlightText(cmd);

}

 

function embossFilterChange(){

//    var controlObject = getControlObject("biasList");

//    var bias = controlObject.options[controlObject.selectedIndex].value;

    var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Emboss()'"; // Bias=" + bias + "

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

 

function engraveFilterChange(){

//    var controlObject = getControlObject("biasList");

//    var bias = controlObject.options[controlObject.selectedIndex].value;

    var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Engrave( )'"; // Bias=" + bias + "

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

 

function pixelateFilterChange(){

    var controlObject = getControlObject("maxSquareFList");

    var maxSquare = controlObject.options[controlObject.selectedIndex].value;

    var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Pixelate( maxsquare="+ maxSquare  +")'";

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

 

function dropShadowFilterChange(){

    var controlObject = getControlObject("shadowColorList");

    var shadowColor = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("offsetXList");

    var offX = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("offsetYList");

    var offY = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("positiveSwitch");

    var positive = controlObject.checked;

    var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.dropShadow( Color=" + shadowColor + ",offX=" + offX + ",offY=" + offY + ",positive=" + positive + ")'";

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

 

function chromaFilterChange(){

    var controlObject = getControlObject("chromaColorList");

    var chromaColor = controlObject.options[controlObject.selectedIndex].value;

    var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Chroma( Color="+ chromaColor +")'";

    eval(cmd);

    updateFilterCode();

    highlightText(cmd);

}

 

function transStart(arg) {

    var obj = getControlObject("oSelect");

    var selectedValue=obj.options[obj.selectedIndex].value;

    if (selectedValue != "empty") {

        imgObj.filters[0].apply();

        if (arg.src.indexOf(startImage)!=-1) {

            arg.src = endImage;

            imgObj.style.backgroundColor = "gold";

                     imgObjText.innerHTML = "<BR><B>Second Page</B><BR><BR>Using the <B>play</B> method reveals the changes in the SPAN element content.";

        }

        else {

            arg.src = startImage;

            imgObj.style.backgroundColor = "skyblue";

                     imgObjText.innerHTML = "<BR><b>First Page</b><BR><BR>Using the <B>apply</B> method prepares this SPAN element for content changes.";

        }

        imgObj.filters[0].play();

    }

}

 

function changeTrans() {

    var obj = getControlObject("oSelect");

    var selectedValue = obj.options[obj.selectedIndex].value;

    sRandomBarsOrientation="";

 

    if (selectedValue != "empty") {

        if (selectedValue.indexOf('Barn')!=-1) {

            oControlsSpan.innerHTML = oBarnControls.innerHTML;

            barnTransChange();

        }

        else if (selectedValue.indexOf('Blinds')!=-1) {

            oControlsSpan.innerHTML = oBlindsControls.innerHTML;

            blindsTransChange();

        }

        else if (selectedValue.indexOf('Checkerboard')!=-1) {

            oControlsSpan.innerHTML = oCheckerboardControls.innerHTML;

            checkerboardTransChange();

        }

        else if (selectedValue.indexOf('Fade')!=-1) {

            oControlsSpan.innerHTML = oFadeControls.innerHTML;

            fadeTransChange();

        }

        else if (selectedValue.indexOf('Iris')!=-1) {

            oControlsSpan.innerHTML = oIrisControls.innerHTML;

            irisTransChange();

        }

        else if (selectedValue.indexOf('Pixelate')!=-1) {

            oControlsSpan.innerHTML = oPixelateTransControls.innerHTML;

            pixelateTransChange();

        }

        else if (selectedValue.indexOf('RadialWipe')!=-1) {

            oControlsSpan.innerHTML = oRadialWipeControls.innerHTML;

            radialWipeTransChange();

        }

        else if (selectedValue.indexOf('RandomBars')!=-1) {

            oControlsSpan.innerHTML = oRandomBarsControls.innerHTML;

            randomBarsTransChange();

        }

        else if (selectedValue.indexOf('Slide')!=-1) {

            oControlsSpan.innerHTML = oSlideControls.innerHTML;

            slideTransChange();

        }

        else if (selectedValue.indexOf('Spiral')!=-1) {

            oControlsSpan.innerHTML = oSpiralControls.innerHTML;

            spiralTransChange();

        }

        else if (selectedValue.indexOf('Stretch')!=-1) {

            oControlsSpan.innerHTML = oStretchControls.innerHTML;

            stretchTransChange();

        }

        else if (selectedValue.indexOf('Strips')!=-1) {

            oControlsSpan.innerHTML = oStripsControls.innerHTML;

            stripsTransChange();

        }

        else if (selectedValue.indexOf('Wheel')!=-1) {

            oControlsSpan.innerHTML = oWheelControls.innerHTML;

            wheelTransChange();

        }

        else if (selectedValue.indexOf('GradientWipe')!=-1) {

            oControlsSpan.innerHTML = oWipeControls.innerHTML;

            wipeTransChange();

        }

        else if (selectedValue.indexOf('Zigzag')!=-1) {

            oControlsSpan.innerHTML = oZigzagControls.innerHTML;

            zigzagTransChange();

        }

        else {

            imgObj.style.filter=selectedValue;

            oControlsSpan.innerHTML = featuresHeader + 'The transition does not support additional features.';

        }

    }

    else {

            imgObj.style.filter=null;

            oControlsSpan.innerHTML =  featuresHeader + 'No transition is currently selected.';

    }

    updateTransCode();

}

 

function updateTransCode() {

    var obj = getControlObject("oSelect");

    var selectedValue=obj.options[obj.selectedIndex].value;

    var imgContents = imgObj.outerHTML;

    if (selectedValue != "empty") {

        oCodePre.innerText=completeTransCode(imgContents);

    }

    else {

        oCodePre.innerText=imgContents;

    }

    highlightText(imgContents);

}

 

function completeTransCode(imgText) {

    scriptBlock = '';

    scriptBlock = scriptBlock + 'var startImage ="' + startImage + '";\n';

    scriptBlock = scriptBlock + 'var endImage="' + endImage + '";\n';

    scriptBlock = scriptBlock + 'function doTrans() {\n';

    scriptBlock = scriptBlock + '        ' + sRandomBarsOrientationText + '\n';

    scriptBlock = scriptBlock + '        imgObj.filters[0].apply();\n';

    scriptBlock = scriptBlock + '        if (oImg.src.indexOf(startImage)!=-1) {\n';

    scriptBlock = scriptBlock + '            oImg.src = endImage;\n';

    scriptBlock = scriptBlock + '            imgObj.style.backgroundColor = "gold";\n';

    scriptBlock = scriptBlock + '            imgObjText.innerHTML = ';

    scriptBlock = scriptBlock + '            "<BR><B>Second Page</B><BR><BR>Using the <B>play</B> method reveals the changes in the SPAN element content."';

 

    scriptBlock = scriptBlock + '        }\n';

    scriptBlock = scriptBlock + '        else {\n';

    scriptBlock = scriptBlock + '            oImg.src = startImage;\n';

    scriptBlock = scriptBlock + '            imgObj.style.backgroundColor = "skyblue";\n';

    scriptBlock = scriptBlock + '            imgObjText.innerHTML = ';

    scriptBlock = scriptBlock + '            "<BR><b>First Page</b><BR><BR>Using the <B>apply</B> method prepares this SPAN element for content changes."';

    scriptBlock = scriptBlock + '        }\n';

    scriptBlock = scriptBlock + '        imgObj.filters[0].play();\n';

    scriptBlock = scriptBlock + '}\n'

    buttonBlock = '\<BR\>\<BR\>\n<BUTTON onclick="doTrans()">Play Transition</BUTTON>\n'

    fullBlock = '\<HEAD\>\n\<SCRIPT\>\n' + scriptBlock + '\<\/SCRIPT\>\n\<\/HEAD\>\n\<BODY\>\n' + imgText + buttonBlock + '\<\/BODY\>';

    return(fullBlock); 

}

 

function barnTransChange(){

    var controlObject = getControlObject("barnMotionList");

    var motion = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("barnVerticalList");

    var orientation = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Barn( motion="+ motion+",orientation="+ orientation+")'";

    eval(cmd);

    updateTransCode();

}

 

function blindsTransChange(){

    var controlObject = getControlObject("blindsBandsList");

    var bands = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("blindsDirectionList");

    var direction = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Blinds( Bands="+ bands+",direction="+ direction+")'";

    eval(cmd);

    updateTransCode();

}

 

function checkerboardTransChange(){

    var controlObject = getControlObject("checkerboardDirectionList");

    var direction = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("squaresXList");

    var squaresX = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("squaresYList");

    var squaresY = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Checkerboard( Direction="+ direction+",SquaresX="+ squaresX+",SquaresY="+ squaresY+")'";

    eval(cmd);

    updateTransCode();

}

 

function fadeTransChange(){

    var controlObject = getControlObject("fadeOverlapList");

    var overlap = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Fade(Overlap=" + overlap +")'";

    eval(cmd);

    updateTransCode();

}

 

function irisTransChange(){

    var controlObject = getControlObject("irisStyleList");

    var irisstyle = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("irisMotionList");

    var motion = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Iris(irisstyle="+ irisstyle+",motion=" + motion +")'";

    eval(cmd);

    updateTransCode();

}

 

function pixelateTransChange(){

    var controlObject = getControlObject("maxSquareTransList");

    var maxSquare = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Pixelate(MaxSquare="+ maxSquare+")'";

    eval(cmd);

    imgObj.filters[0].progress=0;

    updateTransCode();

}

 

function randomBarsTransChange(){

    var controlObject = getControlObject("randomBarsVerticalList");

    var orientation =  controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.RandomBars()'";

    eval(cmd);

    cmd = "imgObj.filters[0].orientation='" + orientation + "';";

    eval(cmd);

    sRandomBarsOrientationText = cmd;

   updateTransCode();

}

 

function radialWipeTransChange(){

    controlObject = getControlObject("radialWipeStyleList");

    wipestyle = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.RadialWipe(wipestyle="+ wipestyle+")'";

    eval(cmd);

    updateTransCode();

}

 

function slideTransChange(){

    controlObject = getControlObject("slideStyleList");

    slidestyle = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("slideBandsList");

    bands = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Slide(slidestyle="+ slidestyle+",Bands=" + bands +")'";

    eval(cmd);

    updateTransCode();

}

 

function spiralTransChange(){

    controlObject = getControlObject("spiralGridSizeXList");

    gridSizeX = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("spiralGridSizeYList");

    gridSizeY = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Spiral(GridSizeX="+ gridSizeX+",GridSizeY=" + gridSizeY +")'";

    eval(cmd);

    updateTransCode();

}

 

function stretchTransChange(){

    controlObject = getControlObject("stretchStyleList");

    stretchstyle = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Stretch(stretchstyle="+ stretchstyle+")'";

    eval(cmd);

    updateTransCode();

}

 

function stripsTransChange(){

    controlObject = getControlObject("movementList");

    motion = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Strips(motion="+ motion+")'";

    eval(cmd);

    updateTransCode();

}

 

function wheelTransChange(){

    controlObject = getControlObject("spokesList");

    spokes = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Wheel(spokes="+ spokes+")'";

    eval(cmd);

    updateTransCode();

}

 

function wipeTransChange(){

    controlObject = getControlObject("wipeReverseSwitch");

    motion = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("gradientSizeList");

    gradientSize = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("wipeStyleList");

    wipestyle = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.GradientWipe(GradientSize="+ gradientSize+",wipestyle=" + wipestyle +",motion=" + motion +")'";

    eval(cmd);

    updateTransCode();

}

 

function zigzagTransChange(){

    controlObject = getControlObject("zigzagGridSizeXList");

    gridSizeX = controlObject.options[controlObject.selectedIndex].value;

    controlObject = getControlObject("zigzagGridSizeYList");

    gridSizeY = controlObject.options[controlObject.selectedIndex].value;

    cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Zigzag(GridSizeX="+ gridSizeX+",GridSizeY=" + gridSizeY +")'";

    eval(cmd);

    updateTransCode();

}

</SCRIPT>

 

<LINK REL="stylesheet" TYPE="text/css" HREF="IASample.css" />

</HEAD>

 

<BODY  BGCOLOR="#FFFFFF" onload="switchContent(filterSection);">

 

<DIV class="desbar" style="height:0">

 

<!-- Rendered content -->

 

<SPAN ID="oLiveSpan" style="POSITION: absolute; TOP: 115px;  LEFT:330px; WIDTH: 300px; " >

 

<SPAN ID="imgObj" style="width:305; height:150; font:bold 9pt verdana ; line-height:1.3; padding-left:13px; padding-right:10px"><IMG ID="oImg"  align="left" style="margin:8px;"><DIV id="imgObjText"></DIV></SPAN>

 

</SPAN>

 

<!-- Control Panel -->

 

 

<SPAN ID="oControlPanel" style="LEFT: 0px; POSITION: relative; TOP: -10; WIDTH: 300; HEIGHT: 250; padding-top: 5px; padding-right: 5px; padding-bottom: 5px; padding-left: 15px; z-index: 5; ">

<BR>

<P>效果类型: <INPUT TYPE=radio NAME="DemoChoice" VALUE="Filters" onclick="switchContent(filterSection); imgObj.style.color='darkred'; imgObj.style.fontWeight='bold';" CHECKED> 滤镜

<INPUT TYPE=radio NAME="DemoChoice" VALUE="Transitions" onclick="switchContent(transitionSection); imgObj.style.color='black'; imgObj.style.fontWeight='normal';"> 渐变

</P>

<SPAN ID="oContentHolder">

</SPAN>

<SPAN ID="oControlsSpan">

</SPAN>

</SPAN>

 

 

 

</DIV>

 

<!-- Copy Code Bar -->

 

<SPAN BGCOLOR="#DDDDDD" class="bar" style="POSITION: relative; z-index:10; HEIGHT: 35px; LEFT: 0px; PADDING-LEFT: 5px; PADDING-RIGHT: 5px;  TEXT-ALIGN: center; TOP: 0px; WIDTH: 100%;">

  <BUTTON STYLE="margin-top:3; margin-bottom:3;" onclick="copy2Clipboard();">

复制显示效果代码

  </BUTTON>

</SPAN>

 

<!-- Code -->

 

<SPAN id=oCodeSpan style="position:relative; FONT-FAMILY: courier new; font-size: 9pt; line-height:1.5;  LEFT: 0px; TOP: 0px; WIDTH: 100%; padding-top: 22px; padding-right: 5px; padding-bottom: 22px; padding-left: 5px; overflow: scroll; z-index: 4; height:30%;">

<SPAN ID="oCodePre" style=" HEIGHT: 100%; WIDTH: 95%">

</SPAN>

</SPAN>

 

<!--Filter-->

<SPAN id=filterSection style="DISPLAY: none" isSource="TRUE">

请选择一个滤镜:

<SELECT id=oSelect onchange=changeFilter()>

  <OPTION value=progid:DXImageTransform.Microsoft.Alpha SELECTED>Alpha</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.AlphaImageLoader>AlphaImageLoader</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.BasicImage >BasicImage</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Blur>Blur</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Chroma>Chroma</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.DropShadow>DropShadow</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Emboss >Emboss</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Engrave>Engrave</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Pixelate>Pixelate</OPTION>

  </SELECT><hr></SPAN>

 

<!--Transition  -->

<SPAN id=transitionSection style="DISPLAY: none" isSource="TRUE">

请选择渐变类型:

<SELECT id=oSelect onchange=changeTrans();>

<OPTION value=progid:DXImageTransform.Microsoft.Barn() SELECTED>Barn</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Blinds()>Blinds</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Checkerboard()>Checkerboard</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Fade()>Fade</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Inset()>Inset</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Iris()>Iris</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Pixelate()>Pixelate</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.RadialWipe()>RadialWipe</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.RandomBars()>Random Bars</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Slide()>Slide</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Spiral()>Spiral</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Stretch()>Stretch</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.CrStrips()>Strips</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Wheel()>Wheel</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.GradientWipe()>GradientWipe</OPTION>

  <OPTION value=progid:DXImageTransform.Microsoft.Zigzag()>Zigzag</OPTION>

  </SELECT>

 

 <BUTTON onclick=transStart(oImg) width="25">看效果</BUTTON><hr></SPAN>

 

<!--Alpha  -->

<SPAN id=oAlphaControls style="DISPLAY: none" isSource="TRUE"><BR/>

Style:

<SELECT onchange=alphaFilterChange() name=styleList>

<OPTION value=0>0 - Uniform Opacity</OPTION>

<OPTION value=1 SELECTED>1 - Linear Opacity Change</OPTION>

<OPTION value=2>2 - Radial Opacity Change</OPTION>

<OPTION value=3>3 - Rectangular Opacity Change</OPTION>

</SELECT>  <BR/><BR/>

Opacity:

<SELECT onchange=alphaFilterChange() name=opacityList>

<OPTION value=0>0</OPTION>

<OPTION value=25 SELECTED>25</OPTION>

<OPTION value=50>50</OPTION>

<OPTION value=75>75</OPTION>

<OPTION value=100>100</OPTION>

</SELECT>

   FinishOpacity:

<SELECT onchange=alphaFilterChange() name=finishOpacityList>

<OPTION value=0>0</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50>50</OPTION>

<OPTION value=75>75</OPTION>

<OPTION value=100 SELECTED>100</OPTION>

</SELECT> <BR/><BR/>

StartX:

<SELECT onchange=alphaFilterChange() name=startXList>

<OPTION value=0 SELECTED>0</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50>50</OPTION>

<OPTION value=75>75</OPTION>

<OPTION value=100>100</OPTION>

</SELECT>

   FinishX:

<SELECT onchange=alphaFilterChange() name=finishXList>

<OPTION value=0>0</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50>50</OPTION>

<OPTION value=75>75</OPTION>

<OPTION value=100 SELECTED>100</OPTION>

</SELECT>

<BR/><BR/>

StartY:

<SELECT onchange=alphaFilterChange() name=startYList>

<OPTION value=0>0</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50>50</OPTION>

<OPTION value=75>75</OPTION>

<OPTION value=100 SELECTED>100</OPTION>

</SELECT>

   FinishY:

<SELECT onchange=alphaFilterChange() name=finishYList>

<OPTION value=0 SELECTED>0</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50>50</OPTION>

<OPTION value=75>75</OPTION>

<OPTION value=100>100</OPTION>

</SELECT> 

</SPAN>

 

<!--AlphaImageLoader -->

<SPAN id=oAlphaImageLoaderControls style="DISPLAY: none" isSource="TRUE"><BR/>

Src (source image):

<SELECT onchange=alphaImageLoaderFilterChange() name=srcList>

<OPTION value='notebook.GIF'  SELECTED>Spiral Bound</OPTION>

<OPTION value='MOUSE2.GIF'>Mouse</OPTION>

</SELECT> 

<BR/><BR/>SizingMethod:

<SELECT onchange=alphaImageLoaderFilterChange() name=sizingMethodList>

<OPTION value='crop' SELECTED>Crop - Crop at boundaries</OPTION>

<OPTION value='image'>Image - Normal image size</OPTION>

<OPTION value='scale'>Scale - Scale to window</OPTION>

</SELECT><BR/><BR/><BR/><BR/>

 

 

</SPAN>

<!--Emboss -->

<SPAN id=oEmbossControls style="DISPLAY: none" isSource="TRUE">

Bias:

<SELECT onchange=embossFilterChange() name=biasList>

<OPTION value=-0.9>-0.9</OPTION>

<OPTION value=-0.5>-0.5</OPTION>

<OPTION value=-0.2>-0.2</OPTION>

<OPTION value=0.00 SELECTED>0.00</OPTION>

<OPTION value=0.2>0.2</OPTION>

<OPTION value=0.5>0.5</OPTION>

<OPTION value=0.9>0.9</OPTION>

</SELECT><BR/><BR/><BR/><BR/>

 

</SPAN>

 

<!--Engrave -->

<SPAN id=oEngraveControls style="DISPLAY: none" isSource="TRUE">

Bias:

<SELECT onchange=engraveFilterChange() name=biasList>

<OPTION value=-0.9>-0.9</OPTION>

<OPTION value=-0.5>-0.5</OPTION>

<OPTION value=-0.2>-0.2</OPTION>

<OPTION value=0.00 SELECTED>0.00</OPTION>

<OPTION value=0.2>0.2</OPTION>

<OPTION value=0.5>0.5</OPTION>

<OPTION value=0.9>0.9</OPTION>

</SELECT><BR/><BR/><BR/><BR/>

 

</SPAN>

 

<!--Blur  -->

<SPAN id=oBlurControls style="DISPLAY: none" isSource="TRUE"><BR/>

PixelRadius:

<SELECT onchange=blurFilterChange() name=pixelRadiusList>

<OPTION value=0>0</OPTION>

<OPTION value=5 SELECTED>5</OPTION>

<OPTION value=10>10</OPTION>

<OPTION value=20>20</OPTION>

</SELECT> <BR/><BR/>

<INPUT onclick=blurFilterChange() type=checkbox name=makeShadowSwitch>

 MakeShadow</INPUT>

<BR><BR>ShadowOpacity:

<SELECT onchange=blurFilterChange() name=shadowOpacityList>

<OPTION value=0.00>0.00</OPTION> <OPTION value=0.25>0.25</OPTION>

<OPTION value=0.50>0.50</OPTION> <OPTION value=0.75>0.75</OPTION>

<OPTION value=1.00 SELECTED>1.00</OPTION>

</SELECT> <BR/><BR/>

</SPAN>

<!-- Pixelate -->

<SPAN id=oPixelateFilterControls style="DISPLAY: none" isSource="TRUE"><BR/>

MaxSquare:

<SELECT onchange=pixelateFilterChange() name=maxSquareFList>

<OPTION value=2>2</OPTION>

<OPTION value=5>5</OPTION>

<OPTION value=10 SELECTED>10</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50>50</OPTION>

</SELECT>

<BR/><BR/><BR/><BR/>

</SPAN>

<!-- DropShadow -->

<SPAN id=oDropShadowControls style="DISPLAY: none" isSource="TRUE"><BR/>

Color:

<SELECT onchange=dropShadowFilterChange() name=shadowColorList>

<OPTION value=DDDDDD>Light Gray (DDDDDD)</OPTION>

<OPTION value=999999 SELECTED>Dark Gray (999999)</OPTION>

<OPTION value=000000>Black (000000)</OPTION>

<OPTION value=FFFF00>Yellow (FFFF00)</OPTION>

<OPTION value=0000FF>Blue (0000FF)</OPTION>

</SELECT>

<BR><BR>

OffX: <SELECT onchange=dropShadowFilterChange() name=OffsetXList>

<OPTION value=-5>-5</OPTION>

<OPTION value=-3>-3</OPTION>

<OPTION value=-1>-1</OPTION>

<OPTION value=1>1</OPTION>

<OPTION value=3>3</OPTION>

<OPTION value=5 SELECTED>5</OPTION>

</SELECT>

OffY: <SELECT onchange=dropShadowFilterChange() name=OffsetYList>

<OPTION value=-5>-5</OPTION>

<OPTION value=-3>-3</OPTION>

<OPTION value=-1>-1</OPTION>

<OPTION value=1>1</OPTION>

<OPTION value=3>3</OPTION>

<OPTION value=5 SELECTED>5</OPTION>

</SELECT><BR><BR>

<INPUT onclick=dropShadowFilterChange() type=checkbox CHECKED name=positiveSwitch>Positive</INPUT>

</SPAN>

<!--Chroma-->

<SPAN id=oChromaControls style="DISPLAY: none" isSource="TRUE"><BR/>

Color:

<SELECT onchange=chromaFilterChange() name=chromaColorList>

<OPTION value='#FFFFFF' SELECTED>White (FFFFFF)</OPTION>

<OPTION value='#87CEEB'>Sky blue (87CEEB)</OPTION>

<OPTION value='#8B0000'>Dark red(8B0000)</OPTION>

<OPTION value='#000000'>Black (000000)</OPTION>

</SELECT><BR/><BR/><BR/><BR/>

 

</SPAN>

<!--BasicImage -->

<SPAN

id=oBasicImageControls style="DISPLAY: none" isSource="TRUE"><BR/>

Rotation:

<SELECT onchange=basicImageFilterChange() name=rotationList>

<OPTION value=0 SELECTED>0 - 0 degrees</OPTION>

<OPTION value=1>1 - 90 degrees</OPTION>

<OPTION value=2>2 - 180 degrees</OPTION>

<OPTION value=3>3 - 270 degrees</OPTION>

</SELECT><BR/><BR/>

Opacity: <SELECT onchange=basicImageFilterChange() name=basicImageOpacityList>

<OPTION value=0.00>0.00</OPTION>

<OPTION value=0.25>0.25</OPTION>

<OPTION value=0.50>0.50</OPTION>

<OPTION value=0.75>0.75</OPTION>

<OPTION value=1.00 SELECTED>1.00</OPTION>

</SELECT><BR><BR/>

<INPUT onclick=basicImageFilterChange() type=checkbox name=mirrorSwitch>Mirror</INPUT>

<INPUT onclick=basicImageFilterChange() type=checkbox name=invertSwitch>Invert</INPUT><BR><BR/>

<INPUT onclick=basicImageFilterChange() type=checkbox name=xraySwitch>X-Ray</INPUT>

<INPUT onclick=basicImageFilterChange() type=checkbox name=grayscaleSwitch>Grayscale</INPUT>

</SPAN>

<!--Barn -->

<SPAN id=oBarnControls style="DISPLAY: none" isSource="TRUE"><BR/>

Motion:

<SELECT onchange=barnTransChange() name=barnMotionList>

<OPTION value=out SELECTED>Out - From inside outward</OPTION>

<OPTION value=in>In - From outside inward</OPTION>

</SELECT> <BR/><BR/>

Orientation:

<SELECT onchange=barnTransChange() name=barnVerticalList>

<OPTION value=horizontal>Horizontal</OPTION>

<OPTION value=vertical SELECTED>Vertical</OPTION>

</SELECT>

</SPAN>

 

<!--Blinds -->

<SPAN id=oBlindsControls style="DISPLAY: none" isSource="TRUE"><BR/>

Bands: <SELECT onchange=blindsTransChange() name=blindsBandsList>

<OPTION value=2>2</OPTION>

<OPTION value=4>4</OPTION>

<OPTION value=6>6</OPTION>

<OPTION value=8>8</OPTION>

<OPTION value=10 SELECTED>10</OPTION>

</SELECT>

Direction:

<SELECT onchange=blindsTransChange() name=blindsDirectionList>

<OPTION value=up SELECTED>Up</OPTION>

<OPTION value=down>Down</OPTION>

<OPTION value=left>Left</OPTION>

<OPTION value=right>Right</OPTION>

</SELECT>

</SPAN>

 

<!--Checkerboard  -->

<SPAN id=oCheckerboardControls style="DISPLAY: none" isSource="TRUE"><BR/>

Direction: <SELECT onchange=checkerboardTransChange() name=checkerboardDirectionList>

<OPTION value=up>Up</OPTION>

<OPTION value=down>Down</OPTION>

<OPTION value=left>Left</OPTION>

<OPTION value=right SELECTED>Right</OPTION>

</SELECT><BR><BR>

SquaresX: <SELECT onchange=checkerboardTransChange() name=squaresXList>

<OPTION value=2 SELECTED>2</OPTION>

<OPTION value=4>4</OPTION>

<OPTION value=6>6</OPTION>

<OPTION value=8>8</OPTION>

<OPTION value=10>10</OPTION>

<OPTION value=12>12</OPTION>

<OPTION value=50>50</OPTION>

</SELECT>

SquaresY: <SELECT onchange=checkerboardTransChange() name=squaresYList>

<OPTION value=2 SELECTED>2</OPTION>

<OPTION value=4>4</OPTION>

<OPTION value=6>6</OPTION>

<OPTION value=8>8</OPTION>

<OPTION value=10>10</OPTION>

<OPTION value=12>12</OPTION>

<OPTION value=50>50</OPTION>

</SELECT> </SPAN>

 

<!--Fade -->

<SPAN id=oFadeControls style="DISPLAY: none" isSource="TRUE"><BR/>

Overlap: <SELECT onchange=fadeTransChange() name=fadeOverlapList>

<OPTION value=0.00>0.00</OPTION>

<OPTION value=0.25>0.25</OPTION>

<OPTION value=0.50>0.50</OPTION>

<OPTION value=0.75>0.75</OPTION>

<OPTION value=1.00 SELECTED>1.00</OPTION>

</SELECT>

</SPAN>

 

<!--Iris  -->

<SPAN id=oIrisControls

style="DISPLAY: none" isSource="TRUE"><BR/>

IrisStyle: <SELECT onchange=irisTransChange() name=irisStyleList>

<OPTION value=DIAMOND>Diamond</OPTION>

<OPTION value=CIRCLE>Circle</OPTION>

<OPTION value=CROSS>Cross</OPTION>

<OPTION value=PLUS SELECTED>Plus</OPTION>

<OPTION value=SQUARE>Square</OPTION>

<OPTION value=STAR>Star</OPTION>

</SELECT> <BR><BR>

Motion: <SELECT onchange=irisTransChange() name=irisMotionList>

<OPTION value=out SELECTED>Out - From inside outward</OPTION>

<OPTION value=in>In - From outside inward</OPTION>

</SELECT>

</SPAN>

 

<!--Pixelate Trans -->

 

<SPAN id=oPixelateTransControls style="DISPLAY: none" isSource="TRUE"><BR/>

MaxSquare: <SELECT onchange=pixelateTransChange() name=maxSquareTransList>

<OPTION value=2>2</OPTION>

<OPTION value=5>5</OPTION>

<OPTION value=10>10</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50 SELECTED>50</OPTION>

</SELECT>

</SPAN>

 

<!--RadialWipe  -->

<SPAN id=oRadialWipeControls

style="DISPLAY: none" isSource="TRUE"><BR/>

WipeStyle: <SELECT onchange=radialWipeTransChange() name=radialWipeStyleList>

<OPTION value=CLOCK SELECTED>Clock</OPTION>

<OPTION value=WEDGE>Wedge</OPTION>

<OPTION value=RADIAL>Radial</OPTION>

</SELECT>

</SPAN>

 

<!--RandomBars -->

 

 

<SPAN id=oRandomBarsControls style="DISPLAY: none" isSource="TRUE"><BR/>

Orientation: <SELECT onchange=randomBarsTransChange() name=randomBarsVerticalList>

<OPTION value=horizontal SELECTED>Horizontal</OPTION>

<OPTION value=vertical>Vertical</OPTION>

</SELECT>

 </SPAN>

 

<!--Slide -->

<SPAN id=oSlideControls style="DISPLAY: none" isSource="TRUE"><BR/>

SlideStyle: <SELECT onchange=slideTransChange() name=slideStyleList>

<OPTION value=HIDE SELECTED>Hide</OPTION>

<OPTION value=PUSH>Push</OPTION>

<OPTION  value=SWAP>Swap</OPTION>

</SELECT> <BR/><BR/>

Bands: <SELECT onchange=slideTransChange() name=slideBandsList>

<OPTION value=1 SELECTED>1</OPTION>

<OPTION value=3>3</OPTION>

<OPTION value=5>5</OPTION>

<OPTION value=10>10</OPTION>

<OPTION value=25>25</OPTION>

<OPTION value=50>50</OPTION>

</SELECT>

</SPAN>

 

<!--Spiral  -->

<SPAN id=oSpiralControls style="DISPLAY: none" isSource="TRUE"><BR/>

GridSizeX: <SELECT onchange=spiralTransChange() name=spiralGridSizeXList>

<OPTION value=8>8</OPTION>

<OPTION value=16 SELECTED>16</OPTION>

<OPTION value=32>32</OPTION>

<OPTION value=64>64</OPTION>

</SELECT>

GridSizeY: <SELECT onchange=spiralTransChange() name=spiralGridSizeYList>

<OPTION value=8>8</OPTION>

<OPTION value=16 SELECTED>16</OPTION>

<OPTION value=32>32</OPTION>

<OPTION value=64>64</OPTION>

</SELECT>

</SPAN>

 

<!--Stretch  -->

<SPAN id=oStretchControls style="DISPLAY: none" isSource="TRUE"><BR/>

StretchStyle: <SELECT onchange=stretchTransChange() name=stretchStyleList>

<OPTION value=HIDE>Hide</OPTION>

<OPTION value=PUSH>Push</OPTION>

<OPTION value=SPIN SELECTED>Spin</OPTION>

</SELECT>

</SPAN>

 

<!--Strips -->

<SPAN id=oStripsControls style="DISPLAY: none" isSource="TRUE"><BR/>

Motion: <SELECT onchange=stripsTransChange() name=movementList>

<OPTION value=leftup>Left-up</OPTION>

<OPTION value=leftdown SELECTED>Left-down</OPTION>

<OPTION value=rightup>Right-up</OPTION>

<OPTION value=rightdown>Right-down</OPTION>

</SELECT>

</SPAN>

 

<!--Wheel  -->

<SPAN id=oWheelControls style="DISPLAY: none" isSource="TRUE"><BR/>

Spokes:

<SELECT onchange=wheelTransChange() name=spokesList>

<OPTION value=2>2</OPTION>

<OPTION value=4 SELECTED>4</OPTION>

<OPTION value=6>6</OPTION>

<OPTION value=8>8</OPTION>

<OPTION value=10>10</OPTION>

</SELECT>

</SPAN>

 

<!--Wipe -->

<SPAN id=oWipeControls style="DISPLAY: none" isSource="TRUE"><BR/>

GradientSize: <SELECT onchange=wipeTransChange() name=gradientSizeList>

<OPTION value=0.00>0.00</OPTION>

<OPTION value=0.25 SELECTED>0.25</OPTION>

<OPTION value=0.50>0.50</OPTION>

<OPTION value=0.75>0.75</OPTION>

<OPTION value=1.00>1.00</OPTION>

</SELECT><BR><BR>

WipeStyle: <SELECT onchange=wipeTransChange() name=wipeStyleList>

<OPTION value=0 SELECTED>0 - Left-to-right motion</OPTION>

<OPTION value=1>1 - Top-to-bottom motion</OPTION>

</SELECT><BR><BR>

Motion: <SELECT onchange=wipeTransChange() name=wipeReverseSwitch>

<OPTION  value=forward SELECTED>Forward</OPTION>

<OPTION  value=reverse>Reverse</OPTION>

</SELECT>

</SPAN>

 

<!--ZigZag  -->

<SPAN id=oZigzagControls style="DISPLAY: none" isSource="TRUE"><BR/>

GridSizeX:

<SELECT onchange=zigzagTransChange() name=zigzagGridSizeXList>

<OPTION value=8>8</OPTION>

<OPTION value=16 SELECTED>16</OPTION>

<OPTION value=32>32</OPTION>

<OPTION value=64>64</OPTION>

<OPTION value=100>100</OPTION>

</SELECT>

GridSizeY: <SELECT onchange=zigzagTransChange() name=zigzagGridSizeYList>

<OPTION value=8>8</OPTION>

<OPTION value=16 SELECTED>16</OPTION>

<OPTION value=32>32</OPTION>

<OPTION value=64>64</OPTION>

<OPTION value=100>100</OPTION>

</SELECT>

</SPAN>

 

 

0 Comments

Fri

20

Mar

2009

88、检测键盘的按键

88、检测键盘的按键

脚本说明:

把如下代码加入<body>区域中

<script language="JavaScript">

<!--

var key,obj=new Object;

obj["8"]="Backspace"

obj["9"]="Tab"

obj["13"]="Enter"

//obj["16"]="Shift"

obj["17"]="Ctrl"

obj["18"]="Alt"

obj["19"]="Break"

obj["20"]="CapsLock"

obj["27"]="ESc"

obj["32"]="Space"

obj["33"]="PageUp"

obj["34"]="PageDown"

obj["35"]="End"

obj["36"]="Home"

obj["37"]="方向Left"

obj["38"]="方向Up"

obj["39"]="方向Right"

obj["40"]="方向Down"

obj["45"]="Insert"

obj["46"]="Delete"

obj["92"]="Window热键"

obj["93"]="菜单热键"

obj["144"]="NumLock"

obj["145"]="ScrollLock"

for(i=1;i<=12;i++)obj[String(111+i)]="F"+i

//for(i=0;i<=9;i++)obj[String(96+i)]="小键盘 "+i

 

function document.onkeydown(){

status=event.keyCode

if(obj[String(event.keyCode)]!=null){alert(obj[String(event.keyCode)]);event.keyCode=0;event.returnValue=false;}

}

function document.onkeypress(){

alert(String.fromCharCode(event.keyCode));

}

window.onhelp=new Function("return false;")

-->

</script>

 

0 Comments

Fri

20

Mar

2009

87、加减密的集成

87、加减密的集成

脚本说明:

把如下代码加入<head>区域中

<TEXTAREA name=up rows=5 cols=50></TEXTAREA><BR><BR><INPUT onclick=down.value=escape(up.value) type=button value=往下加密><INPUT onclick=up.value=unescape(down.value) type=button value=往上解密><BR><BR><TEXTAREA name=down rows=5 cols=50></TEXTAREA>

 

0 Comments

Fri

20

Mar

2009

86、自动显示图形百分比

86、自动显示图形百分比

脚本说明:

把如下代码加入<body>区域中

<script>

function DrawPieChart(){

       var totalvalue = value1.value/360 + value2.value/360 + value3.value/360 + value4.value/360;

       var per1 = value1.value/totalvalue;

       var per2 = value2.value/totalvalue;

       var per3 = value3.value/totalvalue;

       var per4 = value4.value/totalvalue;

 

       var per12 = per1 + per2;

       var per123 = per1 + per2 + per3;

 

Chart.innerHTML = "<OBJECT ID='PieChart' CLASSID='CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6' STYLE='position:relative;top:0;left:0;width:400;height:400'><PARAM NAME='Line0001' ALUE='SetLineColor(255, 0, 127)'><PARAM NAME='Line0002' VALUE='SetFillStyle(1)'><PARAM NAME='Line0003' VALUE='SetFillColor(0, 255, 80)'><PARAM NAME='Line0004' VALUE='Pie(-100, -100, 200, 200, 0, "+ per1 +", 0)'><PARAM NAME='Line0005' VALUE='SetFillStyle(1)'><PARAM NAME='Line0006' VALUE='SetFillColor(0, 0, 255)'><PARAM NAME='Line0007' VALUE='Pie(-100, -100, 200, 200, "+ per1 + ", " + per2 + ", 0)'><PARAM NAME='Line0008' VALUE='SetFillStyle(1)'><PARAM NAME='Line0009' VALUE='SetFillColor(0, 128, 128)'><PARAM NAME='Line0010' VALUE='Pie(-100, -100, 200, 200, "+per12+","+per3+", 0)'><PARAM NAME='Line0011' VALUE='SetFillStyle(1)'><PARAM NAME='Line0012' VALUE='SetFillColor(255, 0, 0)'><PARAM NAME='Line0013' VALUE='Pie(-100, -100, 200, 200, "+per123+","+per4+", 0)'></OBJECT>"

 

 

 

}

</script>

<table border=1 width=100%>

<tr><td id="Chart" width=50% height=400 align=center>

准备画图。。。</td>

<td width=50%>

<p align=center>

输入4个数<br>

<input id="value1" type=text size=6 value=0>

<input id="value2" type=text size=6 value=0>

<input id="value3" type=text size=6 value=0>

<input id="value4" type=text size=6 value=0>

</p>

<p align=center>

<input type=button onclick="DrawPieChart()" value="画饼图">

</p>

</td>

</tr>

</table>

 

0 Comments

Fri

20

Mar

2009

85、特酷高级计算器

85、特酷高级计算器

脚本说明:

第一步:把如下代码加入<body>区域中

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

function doit() {

form.input.value = eval(form.input.value)

}

function Cos() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.cos(x);

}

function Sin() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.sin(x);

}

function Ln() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.log(x);

}

function Root() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.sqrt(x);

}

function Tan() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.tan(x);

}

function Icos() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.acos(x);

}

function Isin() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.asin(x);

}

function Itan() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.atan(x);

}

function Round() {

x = form.input.value

if (x == '') alert('Error: Input Required');

else form.input.value = Math.round(x);

}

function Ran() {

x = form.input.value

form.input.value = Math.random(x);

}

function Neg () {

x = form.input.value

if (x == '') alert('Error: Input Required');

else x = parseFloat(x) * -1;

}

function del() {

x = form.input.value

x = (x.substring) - 1

}

//  End -->

</script>

<div align="center">

<form name="form" method="post" action="javascript:doit()">

  <table width="260" border="0" height="260" align="center" bordercolor="#000000" bgcolor="#000000">

    <tr bgcolor="#000000">

      <td colspan="7" height="2">

        <div align="center"><b><font face="Arial, Helvetica, sans-serif" color="#FFFFFF">特酷高级计算器</font></b></div>

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td colspan="7" height="2">

        <div align="center">

          <input type="text"   name="input" size="40">

        </div>

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50" height="4">

        <input type="button" name="one"   value="1" onClick="form.input.value += '1'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="4">

        <input type="button" name="two"   value="2" onClick="form.input.value += '2'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="4">

        <input type="button" name="three" value="3" onClick="form.input.value += '3'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="20" height="4"> </td>

      <td width="50" height="4">

        <input type="button" name="clear" value="C" onClick="form.input.value = ''" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #9F0004; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="4">

        <input type="button" name="percent" value=" % " onClick="form.input.value = eval(form.input.value) / 100" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="4">

        <input type="button" name="(" value=" ( " onClick="form.input.value += '('" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50" height="2">

        <input type="button" name="four"  value="4" onClick="form.input.value += '4'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="five"  value="5" onClick="form.input.value += '5'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="six"   value="6" onClick="form.input.value += '6'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="20" height="2">  </td>

      <td width="50" height="2">

        <input type="button" name="times" value="  x  " onClick="form.input.value += ' * '" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="div"   value="  /  " onClick="form.input.value += ' / '" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name=")" value=" ) " onClick="form.input.value += ')'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50" height="2">

        <input type="button" name="seven" value="7" onClick="form.input.value += '7'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="eight" value="8" onClick="form.input.value += '8'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="nine"  value="9" onClick="form.input.value += '9'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="20" height="2">  </td>

      <td width="50" height="2">

        <input type="button" name="plus"  value="  +  " onClick="form.input.value += ' + '" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="minus" value="  -  " onClick="form.input.value += ' - '" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="round" value="Rnd" onClick="Round()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50" height="2">

        <input type="button" name="zero"  value="0" onClick="form.input.value += '0'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="point" value="." onClick="form.input.value += '.'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="pi" value="PI" onClick="form.input.value += '3.1415926535897932384626433832795'" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #666666; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="20" height="2">  </td>

      <td width="50" height="2">

        <input type="button" name="pi2" value="+/-" onClick="Neg()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="DoIt"  value=" = " onClick="doit()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50" height="2">

        <input type="button" name="round2" value="Ran#" onClick="Ran()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50" height="24"> </td>

      <td width="50" height="24"> </td>

      <td width="50" height="24"> </td>

      <td width="20" height="24"> </td>

      <td width="50" height="24">  </td>

      <td width="50" height="24"> </td>

      <td width="50" height="24"> </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50">

        <input type="button" name="quad" value="^2" onClick="form.input.value = form.input.value * form.input.value" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="root" value="root" onClick="Root()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="ln" value="ln" onClick="Ln()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="20"> </td>

      <td width="50">

        <input type="button" name="1/2" value="1/2" onClick="form.input.value += '0.5'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="1/3" value="1/3" onClick="form.input.value += '0.3333333333'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="1/4" value="1/4" onClick="form.input.value += '0.25'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50">

        <input type="button" name="sin" value="sin" onClick="Sin()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="cos" value="cos" onClick="Cos()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="tan" value="tan" onClick="Tan()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="20"> </td>

      <td width="50">

        <input type="button" name="1/5" value="1/5" onClick="form.input.value += '0.2'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="1/6" value="1/6" onClick="form.input.value += '0.1666666667'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="1/7" value="1/7" onClick="form.input.value += '0.1428571429'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

    </tr>

    <tr bgcolor="#000000">

      <td width="50">

        <input type="button" name="sin2" value="asin" onClick="Isin()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="cos2" value="acos" onClick="Icos()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="tan2" value="atan" onClick="Itan()" style="COLOR: #FFFFFF; BACKGROUND-COLOR: #333333; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="20"> </td>

      <td width="50">

        <input type="button" name="1/8" value="1/8" onClick="form.input.value += '0.125'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="1/9" value="1/9" onClick="form.input.value += '0.1111111111'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

      <td width="50">

        <input type="button" name="1/10" value="1/10" onClick="form.input.value += '0.1'" style="COLOR: #B3B300; BACKGROUND-COLOR: #000000; HEIGHT: 25 px; WIDTH: 40px">

      </td>

    </tr>

  </table>

</form>

</div>

 

 

 

第二步:把<body>中的内容改为:

<body onLoad="document.form.input.focus()">

 

0 Comments

Fri

20

Mar

2009

84、列表内容的选择

84、列表内容的选择

脚本说明:

把如下代码加入<body>区域中

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

oldvalue = "";

function passText(passedvalue) {

  if (passedvalue != "") {

    var totalvalue = passedvalue+"\n"+oldvalue;

    document.displayform.itemsbox.value = totalvalue;

    oldvalue = document.displayform.itemsbox.value;

  }

}

//  End -->

</script>

<form name="selectform">

<select name="dropdownbox" size=1>

<option value="">请选择</option>

<option value="第一项">第一项</option>

<option value="第二项">第二项</option>

<option value="第三项">第三项</option>

<option value="第四项">第四项</option>

<option value="第五项">第五项</option>

<option value="第六项">第六项</option>

</select>

<input type=button value="添加到列表中" onClick="passText(this.form.dropdownbox.options[this.form.dropdownbox.selectedIndex].value);">

</form>

<form name="displayform" >

<font face="Arial, Helvetica, Sans Serif" size="3"><b>你可以自己选择一下:</b></font><br>

<textarea cols="30" rows="5" name="itemsbox" >

 

0 Comments

Fri

20

Mar

2009

83、产生随机的访问数

83、产生随机的访问数

脚本说明:

把如下代码加入<body>区域中

<script>

 

function fakecounter(){

 

//decrease/increase counter value (depending on perceived popularity of your site!)

var decrease_increase=-50000

 

var counterdate=new Date()

var currenthits=counterdate.getTime().toString()

currenthits=parseInt(currenthits.substring(2,currenthits.length-4))+decrease_increase

 

document.write("你已经是第 <b>"+currenthits+"</b> 位访问本站的网友,欢迎你的光临!")

}

fakecounter()

</script>

 

0 Comments

Fri

20

Mar

2009

82、超酷登陆小窗口

82、超酷登陆小窗口

脚本说明:

把如下代码加入<body>区域中

<style type=text/css>

A {

       FONT: 9pt/13pt "宋体"; TEXT-TRANSFORM: none; COLOR: #000000; TEXT-DECORATION: none

}

A:hover {

       FONT: 9pt/13pt "宋体"; TEXT-TRANSFORM: none; COLOR: #000000; TEXT-DECORATION: underline

}

TD {

       FONT: 9pt/13pt "宋体"; TEXT-TRANSFORM: none; COLOR: #000000

}

.bk {

       BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid

}

.xx {

       BORDER-RIGHT: #cccccc 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #cccccc 1px solid

}

.xy {

       BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 0px solid; BORDER-LEFT: black 0px solid; BORDER-BOTTOM: #000000 1px solid

}

.y {

       BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 0px solid; BORDER-LEFT: #000000 0px solid; BORDER-BOTTOM: #000000 0px solid

}

.x {

       BORDER-RIGHT: #000000 0px solid; BORDER-TOP: #000000 0px solid; BORDER-LEFT: #000000 0px solid; BORDER-BOTTOM: #000000 1px solid

}

.zy {

       BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 0px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 0px solid

}

.bg {

       BACKGROUND-COLOR: #000000

}

.szy {

       BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 0px solid

}

.ys {

       BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 0px solid; BORDER-BOTTOM: #000000 0px solid

}

.zs {

       BORDER-RIGHT: #000000 0px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 0px solid

}

.sx {

       BORDER-RIGHT: #000000 0px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 0px solid; BORDER-BOTTOM: #000000 1px solid

}

.s {

       BORDER-RIGHT: #000000 0px solid; BORDER-TOP: #000000 1px solid; BORDER-LEFT: #000000 0px solid; BORDER-BOTTOM: #000000 0px solid

}

.an {

       BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; FONT-SIZE: 9pt; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid; FONT-FAMILY: "宋体"; HEIGHT: 18px; BACKGROUND-COLOR: #ffffff

}

P {

       FONT: 9pt/13pt "宋体"; TEXT-TRANSFORM: none; COLOR: #000000

}

BR {

       FONT: 9pt/13pt "宋体"; TEXT-TRANSFORM: none; COLOR: #000000

}

.xan {

      BORDER-RIGHT: #000000 0px solid; BORDER-TOP: #000000 0px solid; FONT: 9pt/13pt "宋体"; TEXT-TRANSFORM: none; BORDER-LEFT: #000000 0px solid; COLOR: #000000; BORDER-BOTTOM: #000000 1px solid; BACKGROUND-COLOR: #d3d8dc

}

.dan {

      BORDER-RIGHT: 0px solid; PADDING-RIGHT: 0px; BORDER-TOP: 0px solid; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; FONT: 9pt/13pt "宋体"; TEXT-TRANSFORM: none; BORDER-LEFT: 0px solid; WIDTH: 100%; CLIP: rect(0px 0px 0px 0px); COLOR: #000000; PADDING-TOP: 0px; BORDER-BOTTOM: 0px solid; HEIGHT: 21px; BACKGROUND-COLOR: #ffffff

}

#master {

       Z-INDEX: 2; LEFT: -120px; VISIBILITY: visible; WIDTH: 200px; POSITION: absolute; TOP: 10px

}

#menu {

       Z-INDEX: 5; LEFT: 120px; VISIBILITY: visible; WIDTH: 18px; POSITION: absolute; TOP: 0px

}

#top {

       Z-INDEX: 5; LEFT: 0px; VISIBILITY: visible; WIDTH: 120px; POSITION: absolute; TOP: 0px

}

#screen {

       Z-INDEX: 5; LEFT: 0px; VISIBILITY: visible; WIDTH: 120px; POSITION: absolute; TOP: 6px

}

#screenlinks {

       Z-INDEX: 5; LEFT: 0px; VISIBILITY: visible; WIDTH: 120px; POSITION: absolute; TOP: 6px

}

.NavJump {

       FONT-SIZE: 9pt; COLOR: #000000; FONT-FAMILY: 宋体; TEXT-DECORATION: none

}

A.NavJump:link {

       COLOR: #000000

}

A.NavJump:visited {

       COLOR: #000000

}

A.NavJump:active {

       COLOR: #000000; TEXT-DECORATION: none

}

A.NavJump:hover {

       COLOR: #000000; TEXT-DECORATION: none

}

</style>

 

 

<SCRIPT language=javascript>

<!--

 

 

var ie = document.all ? 1 : 0

var ns = document.layers ? 1 : 0

 

 

var master = new Object("element")

master.curLeft = -120;   master.curTop = 10;

master.gapLeft = 0;        master.gapTop = 0;

master.timer = null;

 

function moveAlong(layerName, paceLeft, paceTop, fromLeft, fromTop){

clearTimeout(eval(layerName).timer)

 

if(eval(layerName).curLeft != fromLeft){

     if((Math.max(eval(layerName).curLeft, fromLeft) - Math.min(eval(layerName).curLeft, fromLeft)) < paceLeft){eval(layerName).curLeft = fromLeft}

else if(eval(layerName).curLeft < fromLeft){eval(layerName).curLeft = eval(layerName).curLeft + paceLeft}

else if(eval(layerName).curLeft > fromLeft){eval(layerName).curLeft = eval(layerName).curLeft - paceLeft}

if(ie){document.all[layerName].style.left = eval(layerName).curLeft}

if(ns){document[layerName].left = eval(layerName).curLeft}

}

 

if(eval(layerName).curTop != fromTop){

     if((Math.max(eval(layerName).curTop, fromTop) - Math.min(eval(layerName).curTop, fromTop)) < paceTop){eval(layerName).curTop = fromTop}

else if(eval(layerName).curTop < fromTop){eval(layerName).curTop = eval(layerName).curTop + paceTop}

else if(eval(layerName).curTop > fromTop){eval(layerName).curTop = eval(layerName).curTop - paceTop}

if(ie){document.all[layerName].style.top = eval(layerName).curTop}

if(ns){document[layerName].top = eval(layerName).curTop}

}

 

 

eval(layerName).timer=setTimeout('moveAlong("'+layerName+'",'+paceLeft+','+paceTop+','+fromLeft+','+fromTop+')',30)

}

 

function setPace(layerName, fromLeft, fromTop, motionSpeed){

eval(layerName).gapLeft = (Math.max(eval(layerName).curLeft, fromLeft) - Math.min(eval(layerName).curLeft, fromLeft))/motionSpeed

eval(layerName).gapTop = (Math.max(eval(layerName).curTop, fromTop) - Math.min(eval(layerName).curTop, fromTop))/motionSpeed

 

moveAlong(layerName, eval(layerName).gapLeft, eval(layerName).gapTop, fromLeft, fromTop)

}

var expandState = 0

 

function expand(){

if(expandState == 0){setPace("master", 0, 10, 10); if(ie){document.menutop.src = "menub.gif"}; expandState = 1;}

else{setPace("master", -120, 10, 10); if(ie){document.menutop.src = "menu20020531.gif"}; expandState = 0;}

}

//-->

</SCRIPT>

 

<DIV id=master>

<DIV id=menu>

<TABLE cellSpacing=0 cellPadding=0 width=18 border=0>

  <TBODY>

  <TR>

    <TD width="100%"><A onfocus=this.blur() href="javascript:expand()"><IMG

      height=70 src="menu20020531.gif" width=18 border=0

  name=menutop></A></TD></TR></TBODY></TABLE></DIV>

<DIV id=top>

<TABLE cellSpacing=0 cellPadding=0 width=120 border=0>

  <TBODY>

  <TR>

    <TD width="100%"><IMG height=6 src="top20020531.gif" width=120

    border=0></TD></TR></TBODY></TABLE></DIV>

<DIV id=screen>

<TABLE cellSpacing=0 cellPadding=5 width=120 border=0>

  <TBODY>

  <TR>

    <TD width="100%" bgColor=#808080>

      <TABLE cellSpacing=0 cellPadding=0 width="100%" bgColor=#808080

        border=0><TBODY>

        <TR>

          <TD width="100%">

            <TABLE cellSpacing=1 cellPadding=5 width="100%" border=0>

              <TBODY>

              <TR>

                <TD width="100%" bgColor=#ffffff><FONT

                  class=NavJump><BR></FONT></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV>

<DIV id=screenlinks>

<TABLE cellSpacing=0 cellPadding=5 width=120 border=0>

  <TBODY>

  <TR>

    <TD width="100%">

      <TABLE cellSpacing=0 cellPadding=0 width="100%" bgColor=#808080

        border=0><TBODY>

        <TR>

          <TD width="100%">

            <TABLE cellSpacing=1 cellPadding=5 width="100%" border=0>

              <TBODY>

              <TR>

                <TD width="100%" bgColor=#ffffff>

                  <TABLE cellSpacing=0 cellPadding=3 width="100%" border=0>

                    <FORM name=form2 action=cklogin.asp method=post>

                    <TBODY>

                    <TR>

                      <TD bgColor=#eeeeee>用户名:</TD></TR>

                    <TR>

                      <TD><INPUT class=an size=12 name=usr> </TD></TR>

                    <TR>

                      <TD bgColor=#eeeeee>密码:</TD></TR>

                    <TR>

                      <TD><INPUT class=an type=password size=12 name=psd>

                    </TD></TR>

                    <TR>

                      <TD bgColor=#eeeeee><INPUT class=an type=submit value=登陆 name=Submit4>

                      </TD></TR></FORM></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

</DIV></DIV>

0 Comments

Fri

20

Mar

2009

81、页面内实现"复制"功能

81、页面内实现"复制"功能

脚本说明:

把如下代码加入<body>区域中

  <SCRIPT>

function CopyAll(T)

{

T.focus() //使文本框得到焦点

T.select() //把文本框中的内容全选

if (document.all){

therange=T.createTextRange()

therange.execCommand("Copy") //复制

}

}

</SCRIPT>

<INPUT TYPE="BUTTON" VALUE="复制" onclick="CopyAll(text1)" >

<BR>

<TEXTAREA NAME="text1" COLS="40" ROWS="5">(内容)</TEXTAREA>

<TEXTAREA  COLS="40" ROWS="5">(你可以在这里粘帖内容)</TEXTAREA>

 

0 Comments

Fri

20

Mar

2009

80、非常酷的VML的类似图片的变换效果

80、非常酷的VML的类似图片的变换效果

<HTML xmlns:v = "urn:schemas-microsoft-com:vml"><HEAD>

<META NAME="Description" CONTENT="VML Animation - Kaleidoscope">

<META NAME="Keywords" CONTENT="kaleidoscope,dhtml, vml, javascript, jscript, animation">

<OBJECT classid=CLSID:10072CEC-8CC1-11D1-986E-00A0C955B42E id=VMLRender></OBJECT>

<STYLE>v\:* {BEHAVIOR: url(#VMLRender)}</STYLE>

<BODY bgColor=#ffffff onresize=resize() scroll=no>

<div>

<v:rect id=bg

style="HEIGHT:400pt;LEFT:0pt;POSITION:absolute;TOP:0pt;WIDTH:880pt;Z-INDEX:-1"

coordsize = "21600,21600"

fillcolor = "#c797e2">

<v:fill type = "gradient"

color2 = "#971647"

angle = "45"

focus = "100%"

focusposition = ".5,.5"

focussize = "0,0"

method = "linear sigma">

</v:fill>

</v:rect>

</div>

<DIV id=kal style='position:absolute;left:0;top:0;'></DIV>

<DIV ID=frm style="position:absolute;top:0;">

<FORM name="myform">

<TABLE>

<TR>

<TD>

VML的图片变换功能:

</TD>

</TR>

<TR>

<TD>

<INPUT TYPE=CHECKBOX name=spointse CHECKED>Even numbers<BR>

</TD>

</TR>

<TR>

<TD>

<INPUT TYPE=CHECKBOX name=spointso CHECKED>Odd numbers<BR>

</TD>

</TR>

<TR><TD>Number of Stars</TD></TR>

<TR>

<TD>

<OBJECT ID="scrnumstars"

STYLE="position:relative; left:0;top:0;width:196;height:10"

STYLE="border:2px solid #696969;"

codeBase="http://activex.microsoft.com/controls/mspert10.cab"

CLASSID="CLSID:DFD181E0-5E2F-11CE-A449-00AA004A803D">

<PARAM NAME="Max" VALUE="12">

<PARAM NAME="Min" VALUE="1">

<PARAM NAME="Position" VALUE="5">

<PARAM NAME="LargeChange" VALUE="2">

<PARAM NAME="Orientation" VALUE="1">

</OBJECT>

</TD>

</TR>

<TR><TD>Minimum Points</TD></TR>

<TR>

<TD>

<OBJECT ID="scrminpts"

STYLE="position:relative; left:0;top:0;width:196;height:10"

STYLE="border:2px solid #696969;"

codeBase="http://activex.microsoft.com/controls/mspert10.cab"

CLASSID="CLSID:DFD181E0-5E2F-11CE-A449-00AA004A803D">

<PARAM NAME="Max" VALUE="20">

<PARAM NAME="Min" VALUE="3">

<PARAM NAME="Position" VALUE="3">

<PARAM NAME="LargeChange" VALUE="2">

<PARAM NAME="Orientation" VALUE="1">

</OBJECT>

</TD>

</TR>

<TR><TD>Maximum Points</TD></TR>

<TR>

<TD>

<OBJECT ID="scrmaxpts" STYLE="position:relative; left:0;top:0;width:196;height:10" STYLE="border:2px solid #696969;"

codeBase="http://activex.microsoft.com/controls/mspert10.cab" CLASSID="CLSID:DFD181E0-5E2F-11CE-A449-00AA004A803D">

<PARAM NAME="Max" VALUE="20">

<PARAM NAME="Min" VALUE="3">

<PARAM NAME="Position" VALUE="8">

<PARAM NAME="LargeChange" VALUE="2">

<PARAM NAME="Orientation" VALUE="1">

</OBJECT>

</TD>

</TR>

<TR><TD>Max Rotation Speed</TD></TR>

<TR>

<TD>

<OBJECT ID="scrrotspd" STYLE="position:relative; left:0;top:0;width:196;height:10" STYLE="border:2px solid #696969;"

codeBase="http://activex.microsoft.com/controls/mspert10.cab" CLASSID="CLSID:DFD181E0-5E2F-11CE-A449-00AA004A803D">

<PARAM NAME="Max" VALUE="100">

<PARAM NAME="Min" VALUE="0">

<PARAM NAME="Position" VALUE="50">

<PARAM NAME="LargeChange" VALUE="5">

<PARAM NAME="Orientation" VALUE="1">

</OBJECT>

</TD>

</TR>

<TR><TD>Max Expansion Speed</TD></TR>

<TR>

<TD>

<OBJECT ID="screxpspd"

STYLE="position:relative; left:0;top:0;width:196;height:10"

STYLE="border:2px solid #696969;"

codeBase="http://activex.microsoft.com/controls/mspert10.cab"

CLASSID="CLSID:DFD181E0-5E2F-11CE-A449-00AA004A803D">

<PARAM NAME="Max" VALUE="100">

<PARAM NAME="Min" VALUE="0">

<PARAM NAME="Position" VALUE="50">

<PARAM NAME="LargeChange" VALUE="5">

<PARAM NAME="Orientation" VALUE="1">

</OBJECT>

</TD>

</TR>

<TR><TD>Max Colour Speed</TD></TR>

<TR>

<TD>

<OBJECT ID="scrcolspd"

STYLE="position:relative; left:0;top:0;width:196;height:10"

STYLE="border:2px solid #696969;"

codeBase="http://activex.microsoft.com/controls/mspert10.cab"

CLASSID="CLSID:DFD181E0-5E2F-11CE-A449-00AA004A803D">

<PARAM NAME="Max" VALUE="100">

<PARAM NAME="Min" VALUE="0">

<PARAM NAME="Position" VALUE="50">

<PARAM NAME="LargeChange" VALUE="5">

<PARAM NAME="Orientation" VALUE="1">

</OBJECT>

</TD>

</TR>

</TABLE>

</FORM>

</DIV>

 

<script>

 

//globals for HSV to RGB conversion

irpnt=new Array(2,1,0,0,3,2);

igpnt=new Array(3,2,2,1,0,0);

ibpnt=new Array(0,0,3,2,2,1);

 

v_spointse=true;

v_spointso=true;

v_scrnumstars=1;

v_scrminpts=3;

v_scrmaxpts=3;

v_scrrotspd=50;

v_screxpspd=50;

v_scrcolspd=50;

 

//alert(document.myform.spointse.value)

w=0;

h=0;

kx=0;

ky=0;

np=0;

maxpoints=30;

maxstars=12;

ss=new Array(500,490,480,470,460,450,440,430);

numstars=5;

scol=new colour(57,.81,.89);

resize();

initkaleidoscope();

 

window.setInterval("frame();",20);

 

function initkaleidoscope(){

var ok=false;

 

v_spointse=document.myform.spointse.checked;

v_spointso=document.myform.spointso.checked;

v_scrnumstars=document.myform.scrnumstars.value;

v_scrminpts=document.myform.scrminpts.value;

v_scrmaxpts=document.myform.scrmaxpts.value;

v_scrrotspd=document.myform.scrrotspd.value;

v_screxpspd=document.myform.screxpspd.value;

v_scrcolspd=document.myform.scrcolspd.value;

if(v_scrminpts>v_scrmaxpts){

v_scrmaxpts=v_scrminpts;

document.myform.scrmaxpts.value=v_scrmaxpts;

}

 

kal.innerHTML="";

vs="";

for(j=0;j<v_scrnumstars;j++){

if(v_scrminpts==v_scrmaxpts){

np=v_scrminpts;

}

else{

np=v_scrminpts+rnd(v_scrmaxpts-v_scrminpts+1);

if(v_spointse!=true)while(np%2!=1)np=v_scrminpts+rnd(v_scrmaxpts-v_scrminpts+1);

if(v_spointso!=true)while(np%2!=0)np=v_scrminpts+rnd(v_scrmaxpts-v_scrminpts+1);

}

hue=rnd(360);

dhue=rnd(v_scrcolspd/6);

theta=0;

dtheta=Math.random()*v_screxpspd/100;

dr=Math.random()*v_scrrotspd/10;if(rnd(2)==0)dr=-dr;

sp=makestarpath(np,500,250*(Math.sin(theta)-1));

vs+="<v:shape id='V"+j+"' np="+np+" hue="+hue+" dhue="+dhue+" dr="+dr+" theta="+theta+" dtheta="+dtheta+" style='position:absolute;left:0px;top:0px;height:500;width:500;rotation:0;opacity:0.5;' fill='true' stroke='true' coordsize='2500,2500' coordorigin '-1250,-1250' fillcolor='#a8f4f7' strokecolor='#a8f4f7' path='"+sp+"'></v:shape>"

}

kal.innerHTML=vs;

}

 

function frame(){

 

if(v_spointse!=document.myform.spointse.checked ||

v_spointso!=document.myform.spointso.checked ||

v_scrnumstars!=document.myform.scrnumstars.value ||

v_scrminpts!=document.myform.scrminpts.value ||

v_scrmaxpts!=document.myform.scrmaxpts.value ||

v_scrrotspd!=document.myform.scrrotspd.value ||

v_screxpspd!=document.myform.screxpspd.value ||

v_scrcolspd!=document.myform.scrcolspd.value){

initkaleidoscope();

}

else{

for(j=0;j<v_scrnumstars;j++){

S=document.all["V"+j];

//animate colour

hue=parseInt(S.hue);

dhue=parseInt(S.dhue);

hue+=dhue;

if(hue>=360)hue-=360;

S.hue=hue;

scol.h=hue;

scol.hsv2rgb();

S.fillcolor=scol.rgb;

S.strokecolor=scol.rgb;

//animate rotation

r=parseFloat(S.style.rotation);

dr=parseFloat(S.dr);

r+=dr;if(r>=360)r-=360;if(r<0)r+=360;

S.style.rotation=r;

//animate geometry

np=parseInt(S.np);

theta=parseFloat(S.theta);

dtheta=parseFloat(S.dtheta);

theta+=dtheta;if(theta>Math.PI)theta-=2*Math.PI;

sp=makestarpath(np,500,250*(Math.sin(theta)-1));

S.path=sp;

S.theta=theta;

}

}

}

 

//n=number of points

//r1=outer diameter

//r2=inner diameter

function makestarpath(n,r1,r2){

s="";

pa=2*Math.PI/n;

ss1=Math.PI/2;

ss2=ss1-pa/2;

x1=Math.floor(r1*Math.cos(ss1));

y1=Math.floor(-r1*Math.sin(ss1));

x2=Math.floor(r2*Math.cos(ss2));

y2=Math.floor(-r2*Math.sin(ss2));

s="m "+(x2+1250)+","+(y2+1250)+" l ";

for (i=1;i<=n;i++){

if(i>1)s+=","

s+=(x1+1250)+","+(y1+1250)+",";

s1=ss1+i*pa;

s2=ss2+i*pa;

x1=Math.floor(r1*Math.cos(s1));

y1=Math.floor(-r1*Math.sin(s1));

x2=Math.floor(r2*Math.cos(s2));

y2=Math.floor(-r2*Math.sin(s2));

s+=(x2+1250)+","+(y2+1250);

}

s+=" e"

return(s);

}

 

function rnd(n){

return(Math.floor(n*Math.random()));

}

 

function resize(){

w=document.body.clientWidth;

h=document.body.clientHeight;

bg.style.width=w-206;

frm.style.left=w-206;

bg.style.height=h;

kx=w/2-250-103;

ky=h/2-250;

kal.style.left=kx;

kal.style.top=ky;

}

 

//utility object for HSV to RGB conversion

function hsv2rgb(){

pqvt=new Array(4);

with(this){

if(s==0){

r=Math.floor(255*v);

g=r;

b=r;

return;

}

if(h>=360)h=0;

nh=h/60;

i=Math.floor(nh);

f=nh-i;

pqvt[2]=255*v;

pqvt[0]=pqvt[2]*(1-s)

pqvt[1]=pqvt[2]*(1-s*f)

pqvt[3]=pqvt[2]*(1-s*(1-f))

r=Math.floor(pqvt[irpnt[i]]);

g=Math.floor(pqvt[igpnt[i]]);

b=Math.floor(pqvt[ibpnt[i]]);

rgb="#"+(65536*r+256*g+b).toString(16);

}

}

 

function colour(h,s,v){

this.h=h;//0-359

this.s=s;//0-1

this.v=v;//0-1

this.r=0;//0-255

this.g=0;//0-255

this.b=0;//0-255

this.rgb="";

this.hsv2rgb=hsv2rgb;

//convert on construction

this.hsv2rgb();

}

 

setInterval("dis();",50);

 

function dis(){

window.status=document.myform.spointse.checked;

}

</script>

 

0 Comments

Fri

20

Mar

2009

79、MP3播放器

79MP3播放器

脚本说明:

把如下代码加入<body>区域中

<object ID="nsPlayer" classid="clsid:05589FA1-C356-11CE-BF01-00AA0055595A">

<PARAM NAME="FileName" VALUE="20020808.mp3">

<PARAM NAME="AutoStart" VALUE="-1">

<PARAM NAME="ShowDisplay" VALUE="0">

</OBJECT>

<script for=nsPlayer event=StateChange>

var arr=new Array("Stopped","Paused","Playing")

alert(arr[nsPlayer.CurrentState])

</script>

 

 

0 Comments

Fri

20

Mar

2009

78、按浏览器选择背景音乐

78、按浏览器选择背景音乐

脚本说明:

<body>中的内容改为:

<SCRIPT LANGUAGE="JavaScript">

var MSIE=navigator.userAgent.indexOf("MSIE");

var NETS=navigator.userAgent.indexOf("Netscape");

var OPER=navigator.userAgent.indexOf("Opera");

if((MSIE>-1)||(OPER>-1))

{

document.write("<BGSOUND SRC=sound.mid LOOP=INFINITE>");

}

else

{

document.write("<EMBED SRC=sound.mid AUTOSTART=TRUE ");

document.write("HIDDEN=true VOLUME=100 LOOP=TRUE>");

}</script>

 

0 Comments

Fri

20

Mar

2009

77、综合的按钮

77、综合的按钮

脚本说明:

把如下代码加入<body>区域中

<textarea id=code cols=50 rows=5></textarea><br>

<button onclick=Preview()>调试代码</button>

<button onclick='code.value=""'>清空内容</button>

<button onclick='code.select()'>全选内容</button>

<button onclick='code.value=document.documentElement.outerHTML'>查看源代码</button>

<script>

function Preview()

{

  var TestWin=open('','','');

  TestWin.document.open('text/html','replace');

  TestWin.document.write(code.value);

  TestWin.document.close();

}

</script>

 

0 Comments

Fri

20

Mar

2009

76、图片变形展开效果

76、图片变形展开效果

脚本说明:

把如下代码加入<body>区域中

<script language="javascript">

count = 40

colorAdder = 255/count

scaleSize = 3

var speed = []

var n = 0

for(b=0;b!=count+1;b++){

a = count - b

speed[b] = Math.cos(b/100)

document.write('<OBJECT ID="RDS" CLASSID="CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6" STYLE="position:absolute;top:0;left:0;width:350;height:350"><PARAM NAME="Line0001" VALUE="SetLineStyle(1)"><PARAM NAME="Line0002" VALUE="SetFillStyle(1)"><PARAM NAME="Line0003" VALUE="SetLineColor('+(b*colorAdder)+','+((b/2)*colorAdder)+','+0+')"><PARAM NAME="Line0004" VALUE="SetFillColor('+(a*colorAdder)+','+((a/2)*colorAdder)+','+0+')"><PARAM NAME="Line0005" VALUE="Rect('+(-(a/2)*(scaleSize/2))+', '+(-(a*2)*(scaleSize/2))+', '+(a*scaleSize)+', '+(a*scaleSize)+', 0)"></OBJECT>')

}

function DoStuff(){

n+=0.01

var tempval2 = speed.slice(1,speed.length)

speed = tempval2.concat([Math.cos(n)*50])

 

for(a=0;a!=count+1;a++){

RDS[a].Rotate(0,0,speed[a]/2)

}

}

setInterval("DoStuff()",10)

</script>

 

0 Comments

Fri

20

Mar

2009

75、不同用户登陆转换

75、不同用户登陆转换

脚本说明:

把如下代码加入<body>区域中

<style>

TD{font-size: 9pt; color: #66DDDD}

.out{font-size: 9pt; color: #66DDDD;border-width:1px;border-style:solid;border-color:0090c0 0070b0 0070b0 0090c0;cursor:hand; background:0080c0; text-align: center}

.out2 {text-align: center}

.in,.out2{font-size: 9pt; color: #66DDDD;border-width:1px;border-style:solid;border-color:0070b0 0090c0 0090c0 0070b0;background:0078b8;cursor:default}

</style>

<script>

var temp_num = null;

var now_num  = null;

 

var the_top = 127;  //表单的最高,最低

var the_bottom = 146

 

var no_can_do = false;

 

function Show_menu(u_num,d_num)

{

       event.srcElement.className = "out2";

      

       if(no_can_do)

       {

              return;

       }    

      

       now_num = d_num;

      

       if(temp_num)

       {

              if(document.getElementById("menu_"+temp_num).doing)

              {

                     clearInterval(document.getElementById("menu_"+temp_num).doing);

              }

       }

       else

       {

              temp_num = u_num;

       }

      

       document.getElementById("menu_"+temp_num).doing = setInterval("set_menu()",10);

      

}

 

function set_menu()

{

       no_can_do = true;

      

       document.getElementById("form_"+temp_num).style.display = "none";

      

       var if_move = document.getElementById("div_"+temp_num).style.pixelHeight - 6;

      

 

       if(if_move>1)

       {

              document.getElementById("div_"+temp_num).style.pixelHeight = if_move;

       }

       else

       {

              document.getElementById("div_"+temp_num).style.pixelHeight = 1;

             

              var if_stop = document.getElementById("menu_"+temp_num).style.pixelTop - 1;

             

              if(if_stop>the_top)

              {

                     document.getElementById("menu_"+temp_num).style.pixelTop = if_stop;

                     document.getElementById("menu_"+now_num).style.pixelTop += 1;

              }

              else

              {

                     document.getElementById("menu_"+temp_num).style.pixelTop = the_top;

                     document.getElementById("menu_"+now_num).style.pixelTop = the_bottom;

                    

                     var if_end = document.getElementById("div_"+now_num).style.pixelHeight + 6;

                    

                     if(if_end < 182)

                     {

                            document.getElementById("div_"+now_num).style.pixelHeight = if_end

                     }

                     else

                     {

                            document.getElementById("div_"+now_num).style.pixelHeight = 182;

                           

                            clearInterval(document.getElementById("menu_"+temp_num).doing);

                           

                            document.getElementById("menu_"+temp_num).doing = false;

                           

                            document.getElementById("form_"+now_num).style.display = "block";

                           

                            temp_num = null;

                           

                            no_can_do = false;

                     }

 

              }

             

       }

      

}

 

function returnIT()

{

       event.srcElement.className = "out";

}

</script>

 

<div id="menu_0" style="position: absolute; top: 127; left: 176; width: 339; height: 201">

 

<table border="0" width="100%" style="background-color: #0080C0" cellspacing="0" cellpadding="0" height="19">

  <tr>

    <td width="277" class="out" height="19" style="cursor: default"> </td>

    <td width="58" class="out" height="19" onmousedown="Show_menu(1,0)" onmouseup="returnIT()">老师登录</td>

  </tr>

</table>

<div  id="div_0" style="position: relative; width: 339; height: 1; overflow: hidden">

<table border="0" width="100%" style="background-color: #0080C0" cellspacing="0" cellpadding="0" height="182">

  <tr>

    <td width="100%" height="182">

      <form id="form_0" style="position: relative; left:70; top:10;font-family: Arial; display: none" action="javascript:;" method="post" align="center">

 

        当前用户类型:老师

        <br>

        <br>

        用户: <input class="in" style="WIDTH: 100px" size="20"> mail.cn<br>                         

        口令: <input class="in" type="password" size="20"><br>                          

        <br>

                                  

       <input class="out"  onfocus="this.blur()"  type="button" value="登录服务器">         

      </form>

       </td>

  </tr>

</table>

</div>

</div>

 

 

 

 

<div id="menu_1" style="position: absolute; top: 146; left: 176; width: 339; height: 219">

 

<table border="0" width="100%" style="background-color: #0080C0" cellspacing="0" cellpadding="0" height="19">

  <tr>

    <td width="277" class="out" height="19" style="cursor: default"> </td>

    <td width="58" class="out" height="19" onmousedown="Show_menu(0,1)" onmouseup="returnIT()">学生登录</td>

  </tr>

</table>

<div  id="div_1" style="position: relative; width: 339; height: 182; overflow: hidden">

<table border="0" width="100%" style="background-color: #0080C0" cellspacing="0" cellpadding="0" height="100%">

  <tr>

    <td width="100%" height="182">

      <form id="form_1" style="position: relative; left:70; top:10;font-family: Arial; display: block" action="javascript:;" method="post" align="center">

 

        当前用户类型:学生

        <br>

        <br>

        用户: <input class="in" style="WIDTH: 100px" size="20"> mail.cn<br>                        

        口令: <input class="in" type="password" size="20"><br>                          

        <br>

                                

       <input class="out"  onfocus="this.blur()"  type="button" value="登录服务器">         

      </form>

       </td>

  </tr>

</table>

</div>

</div>

 

0 Comments

Fri

20

Mar

2009

74、编程时文件上传

74、编程时文件上传

脚本说明:

把如下代码加入<body>区域中

<style type="text/css">

<!--

td {  font-size: 9pt}

a {  color: #000000; text-decoration: none}

a:hover {  text-decoration: underline}

.tx {  height: 16px; width: 30px; border-color: black black #000000; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px; font-size: 9pt; background-color: #eeeeee; color: #0000FF}

.bt {  font-size: 9pt; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; height: 16px; width: 80px; background-color: #eeeeee; cursor: hand}

.tx1 { height: 20px; width: 30px; font-size: 9pt; border: 1px solid; border-color: black black #000000; color: #0000FF}

-->

</style>

<form name="form1" method="post" action="upfile.asp" enctype="multipart/form-data" >

 

  <input type="hidden" name="act" value="upload">

  <br>

  <table width="71%" border="1" cellspacing="0" cellpadding="5" align="center" bordercolordark="#CCCCCC" bordercolorlight="#000000">

   

    <tr align="left" valign="middle" bgcolor="#eeeeee">

      <td bgcolor="#eeeeee" height="92">

        <script language="javascript">

         function setid()

         {

         str='<br>';

         if(!window.form1.upcount.value)

          window.form1.upcount.value=1;

        for(i=1;i<=window.form1.upcount.value;i++)

            str+='文件'+i+':<input type="file" name="file'+i+'" style="width:400" class="tx1"><br><br>';

         window.upid.innerHTML=str+'<br>';

         }

         </script>

        <li> 需要上传的个数

          <input type="text" name="upcount" class="tx" value="1">

          <input type="button" name="Button" class="bt" onclick="setid();" value="· 设定 ·">

        </li>

        <br>

        <br>

        <li>上传到:

          <input type="text" name="filepath" class="tx" style="width:350" value="">

        </li>

      </td>

    </tr>

    <tr align="center" valign="middle">

      <td align="left" id="upid" height="122"> 文件1:

        <input type="file" name="file1" style="width:400" class="tx1" value="">

      </td>

    </tr>

    <tr align="center" valign="middle" bgcolor="#eeeeee">

      <td bgcolor="#eeeeee" height="24">

        <input type="submit" name="Submit" value="· 提交 ·" class="bt">

        <input type="reset" name="Submit2" value="· 重执 ·" class="bt">

      </td>

    </tr>

  </table>

</form>

<script language="javascript">

 

setid();

</script>

 

0 Comments

Fri

20

Mar

2009

72、语音大小写转换

72、语音大小写转换

脚本说明:

把如下代码加入<body>区域中

<bgsound id=bgsoundone src="" loop=1>

<SCRIPT LANGUAGE="VBScript">

dim hj,hji

sub document_onkeypress()

if window.event.srcelement.id="num" and window.event.keycode="13" then

call retu_cn()

end if

end sub

sub window_onload()

document.fmSubmit.t1.focus()

end sub

SUB retu_cn()

dim n,m_hj,s,ch,ch2,ch3,num

num=Replace(trim(document.fmSubmit.t1.value),",","",1,-1,1)

if num="" then

MsgBox "您还没有输入金额!"

document.fmSubmit.t1.focus()

exit sub

End If

if IsNumeric(num)=False then

MsgBox "您输入的不是金额!"

document.fmSubmit.t1.focus()

exit sub

End If

n=FormatNumber(num,2)

num=n

n=Replace(n,",","",1,-1,1)

If len(n)>15 Then

MsgBox "金额必须小于千亿!"

document.fmSubmit.t1.focus()

exit sub

End If

hj=space(0)

s="840"

ch="壹贰叁肆伍陆柒捌玖"

ch2="仟佰拾 "

ch3="亿万元"

for x=1 to 3

m=cstr(int(n/10^FormatNumber(mid(s,x,1),0,-1)))

m=space(4-len(m))+m

m_hj=space(0)

if m<>" 0" then

for y=1 to 4

if mid(m,y,1)<>space(1) and mid(m,y,1)<>"0" then

m_hj=trim(m_hj+mid(ch,FormatNumber(mid(m,y,1),0,-1),1)+mid(ch2,y,1))

else

if mid(m,y,1)=space(1) or mid(m,y,1)="0" then

m_hj=m_hj

if right(m_hj,1)="" then

m_hj=m_hj+space(0)

else

m_hj=m_hj+""

end if

else

m_hj=m_hj

end if

end if

next

if right(m_hj,1)="" then

m_hj=mid(m_hj,1,len(m_hj)-1)+mid(ch3,x,1)

if x=3 then

m_hj=m_hj+space(0)

else

m_hj=m_hj+""

end if

else

m_hj=m_hj+mid(ch3,x,1)

end if

if right(hj,1)="" and mid(m_hj,1,1)="" then

hj=hj+mid(m_hj,2,len(m_hj)-1)

else

hj=hj+m_hj

end if

else

if x=3 then

if right(hj,1)="" then

if trim(hj)="" then

hj=hj+space(0)

else

hj=mid(hj,1,len(hj)-1)+""

end if

else

if trim(hj)="" then

hj=hj+space(0)

else

hj=hj+""

end if

end if

else

if right(hj,1)="" then

hj=hj+space(0)

else

hj=hj+""

end if

end if

end if

if n-int(n)=0 then

n=n-int(FormatNumber(m,0,-1))*10^int(FormatNumber(mid(s,x,1),0,-1))

else

tt=FormatNumber("0."+mid(cstr(n),Instr(1,n,".")+1,2),2)

n=int(n)

n=n-int(FormatNumber(m,0,-1))*10^int(FormatNumber(mid(s,x,1),0,-1))

n=n+tt

end if

next

m=mid(cstr(n),2,2)

if trim(len(m))<>2 then

m=m+"0"

end if

if n*100=0 then

if left(hj,1)="" then

if right(hj,1)="" then

hj=hj+"元整"

else

hj=mid(hj,2,len(hj)-1)+""

end if

else

if right(hj,1)="" then

hj=mid(hj,1,len(hj)-1)+""

else

hj=hj+""

end if

end if

else

if right(hj,1)="" then

hj=mid(hj,1,len(hj)-1)

else

hj=hj

if mid(m,1,1)="0" or mid(m,1,1)=space(1) then

hj=hj+""

else

hj=hj+mid(ch,FormatNumber(mid(m,1,1),0,-1),1)+""

end if

end if

if mid(hj,1,1)="" then

hj=mid(hj,2,len(hj)-1)

else

hj=hj

end if

if mid(m,2,1)="0" then

hj=hj+""

else

hj=hj+mid(ch,FormatNumber(mid(m,2,1),0,-1),1)+""

end if

end if

 

if num=".00" then

document.fmSubmit.t1.value="0.00"

else

document.fmSubmit.t1.value=num

end if

document.fmSubmit.t2.value=""

hji=1

call read()

End Sub

 

SUB read()

MyVar=mid(hj,hji,1)

document.fmSubmit.t2.value=document.fmSubmit.t2.value+MyVar

Select Case MyVar

Case "" document.all("bgsoundone").src="wav/0.wav"

Case "" document.all("bgsoundone").src="wav/1.wav"

Case "" document.all("bgsoundone").src="wav/2.wav"

Case "" document.all("bgsoundone").src="wav/3.wav"

Case "" document.all("bgsoundone").src="wav/4.wav"

Case "" document.all("bgsoundone").src="wav/5.wav"

Case "" document.all("bgsoundone").src="wav/6.wav"

Case "" document.all("bgsoundone").src="wav/7.wav"

Case "" document.all("bgsoundone").src="wav/8.wav"

Case "" document.all("bgsoundone").src="wav/9.wav"

Case "" document.all("bgsoundone").src="wav/10.wav"

Case "" document.all("bgsoundone").src="wav/b.wav"

Case "" document.all("bgsoundone").src="wav/q.wav"

Case "" document.all("bgsoundone").src="wav/w.wav"

Case "亿" document.all("bgsoundone").src="wav/y.wav"

Case "" document.all("bgsoundone").src="wav/yuan.wav"

Case "" document.all("bgsoundone").src="wav/fen.wav"

Case "" document.all("bgsoundone").src="wav/jiao.wav"

Case "" document.all("bgsoundone").src="wav/z.wav"

Case else hji=0

document.all("bgsoundone").src=""

exit sub

End Select

hji=hji+1

setTimeout "read",500

End Sub

</script>

<form id=fmSubmit name=fmSubmit method="POST">

<p>请输入金额:<input type="text" name="T1" size="20" id="num">  <input type="button" onclick=retu_cn() value="转换大写金额" name="B1"></p>

<br>  大写金额:<input type="text" name="T2" size="55" readonly>

</form>

 

0 Comments

Fri

20

Mar

2009

73、直接计算的计算器

73、直接计算的计算器

脚本说明:

把如下代码加入<body>区域中

<script>

var textobj = document.all.tags("input");

function share() {

  textobj[2].value =new Number(textobj[0].value)+new Number(textobj[1].value);

}

setInterval("share();",100);

</script>

<input type="text">+

<input type="text">=

<input type="text">

 

0 Comments

Fri

20

Mar

2009

71、按星期几嵌入内容

71、按星期几嵌入内容

脚本说明:

把如下代码加入<body>区域中

<script language="JavaScript1.2">

 

var ie=document.all&&navigator.userAgent.indexOf("Opera")==-1

var dom=document.getElementById&&navigator.userAgent.indexOf("Opera")==-1

 

//Specify IFRAME display attributes

var iframeprops='width=150 height=150 marginwidth="0" marginheight="0" hspace="0" vspace="0" frameborder="1" scrolling="no"'

 

//Specify 7 URLs to display inside iframe, one for each day of week

var daycontent=new Array()

daycontent[1]="monday.htm" //Monday content

daycontent[2]="tuesday.htm" //Tuesday content

daycontent[3]="wednesday.htm"

daycontent[4]="thursday.htm"

daycontent[5]="friday.htm"

daycontent[6]="saturday.htm"

daycontent[0]="sunday.htm"

 

//No need to edit after here

if (ie||dom)

document.write('<iframe id="dynstuff" src="" '+iframeprops+'></iframe><BR>按星期几在上面分别显示不同的页面')

 

var mydate=new Date()

var mytoday=mydate.getDay()

 

function dayofweek_iframe(){

if (ie||dom){

var iframeobj=document.getElementById? document.getElementById("dynstuff") : document.all.dynstuff

iframeobj.src=daycontent[mytoday]

}

}

 

window.onload=dayofweek_iframe

 

</script>

0 Comments

Fri

20

Mar

2009

70、下拉框的新特性

70、下拉框的新特性

脚本说明:

第一步:把如下代码加入<body>区域中

<script language="JavaScript">

<!--

function catch_keydown(sel)

{

       switch(event.keyCode)

       {

              case 13:

                     //Enter;

                     sel.options[sel.length] = new Option("","",false,true);

                     event.returnValue = false;

                     break;

              case 27:

                     //Esc;

                     alert("text:" + sel.options[sel.selectedIndex].text + ", value:" + sel.options[sel.selectedIndex].value + ";");

                     event.returnValue = false;

                     break;

              case 46:

                     //Delete;

                     if(confirm("删除当前选项!?"))

                     {

                            sel.options[sel.selectedIndex] = null;

                            if(sel.length>0)

                            {

                                   sel.options[0].selected = true;

                            }

                     }

                     event.returnValue = false;

                     break;

              case 8:

                     //Back Space;

                     var s = sel.options[sel.selectedIndex].text;

                     sel.options[sel.selectedIndex].text = s.substr(0,s.length-1);

                     event.returnValue = false;

                     break;

       }

      

}

function catch_press(sel)

{

       sel.options[sel.selectedIndex].text = sel.options[sel.selectedIndex].text + String.fromCharCode(event.keyCode);

       event.returnValue = false;

}

//-->

</script>

<select name=s1 onkeydown="catch_keydown(this);" onkeypress="catch_press(this);" style="font-size:12px;"><option>---</option></select>

 

第二步:把<body>中的内容改为:

<body bgcolor="#fef4d9" onload="s1.focus();">

 

0 Comments

Fri

20

Mar

2009

69、单词的翻译

69、单词的翻译

脚本说明:

把如下代码加入<body>区域中

<STYLE>BODY {

 COLOR: black; FONT-SIZE: 9pt

}

TD {

 COLOR: black; FONT-SIZE: 9pt

}

TH {

 COLOR: black; FONT-SIZE: 9pt

}

A {

 TEXT-DECORATION: none

}

A:hover {

 COLOR: blue

}

TD {

 CURSOR: hand

}

.cs {

 COLOR: navy; CURSOR: hand

}

</STYLE>

<SCRIPT>

self.moveTo(0,0)

self.resizeTo(screen.availWidth,screen.availHeight)

</SCRIPT>

<CENTER>

<TABLE bgColor=#eeeeee border=1 borderColorDark=white borderColorLight=black

cellPadding=0 cellSpacing=0 height=400 width=500>

  <TBODY>

  <TR vAlign=top>

    <TD style="CURSOR: auto">

      <FORM action=http://202.110.201.11/instanttrans/instanttrans method=post>

      <TABLE bgColor=#dedede border=1 borderColorDark=white

      borderColorLight=black cellPadding=0 cellSpacing=0 id=mtv width=390>

        <TBODY>

        <TR align=middle>

          <TD

          onclick="one();a.style.color='black';b.style.color='gray';c.style.color='gray';d.style.color='gray';e.style.color='gray';f.style.color='gray';g.style.color='gray';"

          style="BORDER-BOTTOM: 0px" width="10%"><B><FONT

          id=a>常用1</FONT></B></TD>

          <TD

          onclick="a1();this.style.borderBottom='0';a.style.color='gray';b.style.color='black';c.style.color='gray';d.style.color='gray';e.style.color='gray';f.style.color='gray';g.style.color='gray';"

          width="10%"><B><FONT color=gray id=b>常用2</FONT></B></TD>

          <TD

          onclick="a2();this.style.borderBottom='0';a.style.color='gray';b.style.color='gray';c.style.color='black';d.style.color='gray';e.style.color='gray';f.style.color='gray';g.style.color='gray';"

          width="10%"><B><FONT color=gray id=c>动词</FONT></B></TD>

          <TD

          onclick="a3();this.style.borderBottom='0';a.style.color='gray';b.style.color='gray';c.style.color='gray';d.style.color='black';e.style.color='gray';f.style.color='gray';g.style.color='gray';"

          width="10%"><B><FONT color=gray id=d>连词</FONT></B></TD>

          <TD

          onclick="a4();this.style.borderBottom='0';a.style.color='gray';b.style.color='gray';c.style.color='gray';d.style.color='gray';e.style.color='black';f.style.color='gray';g.style.color='gray';"

          width="10%"><B><FONT color=gray id=e>描述</FONT></B></TD>

          <TD

          onclick="a5();this.style.borderBottom='0';a.style.color='gray';b.style.color='gray';c.style.color='gray';d.style.color='gray';e.style.color='gray';f.style.color='black';g.style.color='gray';"

          width="10%"><B><FONT color=gray id=f>物主</FONT></B></TD>

          <TD

          onclick="a6();this.style.borderBottom='0';a.style.color='gray';b.style.color='gray';c.style.color='gray';d.style.color='gray';e.style.color='gray';f.style.color='gray';g.style.color='black';"

          width="10%"><B><FONT color=gray id=g>时差</FONT></B></TD>

          <TD onclick=help() style="CURSOR: help"

        width="10%"><U>帮助</U></TD></TR></TBODY></TABLE>

      <DIV id=nnn>

      <TABLE bgColor=#dedede border=1 borderColorDark=white

      borderColorLight=black cellPadding=4 cellSpacing=0 id=tv rules=none

      style="BORDER-TOP: 0px" width=400>

        <TBODY>

        <TR align=middle>

          <TD onclick="asp.value+='Computer'" width="10%">电脑</TD>

          <TD onclick="asp.value+='Network'" width="10%">网络</TD>

          <TD onclick="asp.value+='Information'" width="10%">信息</TD>

          <TD onclick="asp.value+='Chat'" width="10%">聊天</TD>

          <TD onclick="asp.value+='Study'" width="10%">学习</TD>

          <TD onclick="asp.value+='Glacier'" width="10%">冰河</TD>

          <TD onclick="asp.value+='Game'" width="10%">游戏</TD>

          <TD onclick="asp.value+='Hobbyhorse'" width="10%">木马</TD>

          <TD onclick="asp.value+='Webpage'" width="10%">网页</TD>

          <TD onclick="asp.value+='Keyboard'" width="10%">键盘</TD></TR>

        <TR align=middle>

          <TD onclick="asp.value+='Mouse'" width="10%">鼠标</TD>

          <TD onclick="asp.value+='Software'" width="10%">软件</TD>

          <TD onclick="asp.value+='Hardware'" width="10%">硬件</TD>

          <TD onclick="asp.value+='Equipment '" width="10%">设备</TD>

          <TD onclick="asp.value+='Operation'" width="10%">操作</TD>

          <TD onclick="asp.value+='Procedure'" width="10%">程序</TD>

          <TD onclick="asp.value+='System'" width="10%">系统</TD>

          <TD onclick="asp.value+='Programming'" width="10%">编程</TD>

          <TD onclick="asp.value+='Attribute'" width="10%">属性</TD>

          <TD onclick="asp.value+='Input'" width="10%">输入</TD></TR>

        <TR align=middle>

          <TD onclick="asp.value+='Export'" width="10%">输出</TD>

          <TD onclick="asp.value+='Editor'" width="10%">编辑</TD>

          <TD onclick="asp.value+='Multimedia'" width="10%">多媒体</TD>

          <TD onclick="asp.value+='Content'" width="10%">内容</TD>

          <TD onclick="asp.value+='Hacker'" width="10%">黑客</TD>

          <TD onclick="asp.value+='Video'" width="10%">视频</TD>

          <TD onclick="asp.value+='File'" width="10%">文件</TD>

          <TD onclick="asp.value+='Duplicate'" width="10%">复制</TD>

          <TD onclick="asp.value+='Paste'" width="10%">粘贴</TD>

          <TD onclick="asp.value+='Remove'" width="10%">清除</TD></TR>

        <TR align=middle>

          <TD onclick="asp.value+='Virus'" width="10%">病毒</TD>

          <TD onclick="asp.value+='Start'" width="10%">启动</TD>

          <TD onclick="asp.value+='Channel'" width="10%">频道</TD>

          <TD onclick="asp.value+='Symbol'" width="10%">符号</TD>

          <TD onclick="asp.value+='Special'" width="10%">特殊</TD>

          <TD onclick="asp.value+='Code'" width="10%">代码</TD>

          <TD onclick="asp.value+='Byte'" width="10%">字节</TD>

          <TD onclick="asp.value+='Deliver'" width="10%">发送</TD>

          <TD onclick="asp.value+='Cancel'" width="10%">撤消</TD>

          <TD onclick="asp.value+='Run'" width="10%">运行</TD></TR>

        <TR align=middle>

          <TD onclick="asp.value+='Join'" width="10%">连接</TD>

          <TD onclick="asp.value+='Address'" width="10%">地址</TD>

          <TD onclick="asp.value+='Data'" width="10%">数据</TD>

          <TD onclick="asp.value+='Characters'" width="10%">文字</TD>

          <TD onclick="asp.value+='Translate'" width="10%">翻译</TD>

          <TD onclick="asp.value+='Free'" width="10%">免费</TD>

          <TD onclick="asp.value+='Serve'" width="10%">服务</TD>

          <TD onclick="asp.value+='Tabletop'" width="10%">桌面</TD>

          <TD onclick="asp.value+='save'" width="10%">存储</TD>

          <TD onclick="asp.value+='write'"

      width="10%"></TD></TR></TBODY></TABLE></DIV>

      <TABLE bgColor=#dedede border=1 borderColorDark=white

      borderColorLight=black cellPadding=0 id=vvv width=400 cellsapcing="0">

        <TBODY>

        <TR>

          <TD colSpan=10><TEXTAREA cols=40 id=asp name=content rows=6 style="WIDTH: 100%" wrap=VIRTUAL>

 

0 Comments

Fri

20

Mar

2009

68、web页在线开发

68web页在线开发

脚本说明:

把如下代码加入<body>区域中

<style>

body,td,th{font-size:9pt;color:black}

a{text-decoration:none;}

a:hover{color:blue;}

input{cursor:hand;width:30pt;background-color:cccccc;height:22px}

select{background-color:cccccc;color:navy}

</style>

<script>

self.moveTo(0,0)

self.resizeTo(screen.availWidth,screen.availHeight)

</script>

<script>

function look(){

if(event.keyCode==113){liulan.onclick()}

}

if(document.onkeydown==null)

{document.onkeydown=look}

</script>

<script language=vbs>

sub helpa()

msgbox"技巧1:[shift+回车键]为软回车,可以避免硬回车带来的一次空两行,不防试试"+Chr(10)&Chr(10)+"技巧2:脱离编辑窗口以后按下F2键可以直接开新窗口浏览你正编辑的网页"+Chr(10)&Chr(10)+"技巧3:保存功能,你可以把你编辑的HTML代码复制到里面,然后在去[我的文档]中打开"+Chr(10)&Chr(10)+"技巧4:应当注意使用右键,你现在在编辑窗内单击右键看看,有很多的实用功能"+Chr(10)&Chr(10)+"技巧5:说明窗口,你可以将鼠标靠近你不懂的地方,下面应该有说明"+Chr(10)&Chr(10)&Chr(10)+"注意1:对选中的文本进行编辑功能有限,只能对一小段文本,如果处理很多他不会起作用"+Chr(10)&Chr(10)+"注意2:HTML编辑模式时是不支持你编写head内的代码的,只能翻译body内的文本,注意哦"+Chr(10)&Chr(10)+"注意3:插入代码时,编辑窗口应该无反映,只有你在[浏览网页]时才会起作用"+Chr(10)&Chr(10)+"注意4:其实此编辑器提供的功能并不多,要做到某些效果还是得靠你手工修改HTML代码"+Chr(10)&Chr(10)+"注意5:如果你右键选择了[浏览网页]不能在编辑了,这时你试着用上面的[工作状态]"+Chr(10)&Chr(10)&Chr(10)+"秘籍:本人从来都靠HTML走天下,但很费力,后来发明了他,[拖放复制]人家东西太方便了"+Chr(10)&Chr(10)&Chr(10)+"版权:此东西是孤独刺客原创,Q:30514069,[素质]的各位站长转载请声明出处,谢谢",4096,"孤独刺客lshdic类作品:在线WEB页制作器帮助信息"

end sub

</script>

</head>

<body leftmargin=0 topmargin=0 bgcolor=dddddd link=navy vlink=navy alink=purple onload="edit.document.designMode='on'"><base target=_blank><center>

<table cellspacing=0 cellpadding=0 border=2 width=769 id=iihj bgcolor=cccccc align=center border=0 bordercolorlight=555555 bordercolordark=white style="border-top:0px;border-left:0px"><Tr><td colspan=2 height="15" width="787"><input type=button value="新建" onClick="if(edit.document.body.innerHTML==''){alert('文件已经是空白状态')}else{if(confirm('清除所有正在编辑的网页内容?')){edit.document.body.innerHTML=''}}" style="width:40pt;background-color:aaaaaa" onmouseover="hll('将正编写的数据全部清除')" onmouseout="hll('')"><input type=button value="保存" onClick="window.open('view-source:file:///c:/my documents/在线web作品之一.html','_self')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('把原代码保存在你的记事本里')" onmouseout="hll('')"><input type=button value=寄存 onClick="window.open('http://homepage.3322.net/cgi-bin/cgiwrap/longxin9/bbs/bbs.cgi?id=200110181243');alert('以打开论坛,你做好了网页,就把HTML代码临时放在那里把')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('打开论坛把数据保存在那')" onmouseout="hll('')"><input type=button value="盗用" onClick="var sa=window.prompt('请问你要盗窃谁家的网页原文件?','http://');window.location='view-source:'+sa" style="width:40pt;background-color:aaaaaa" onmouseover="hll('输入正确网址,学用原代码')" onmouseout="hll('')"><input type=button value=复写 onclick="if(edit.document.selection.createRange().text!=''){edit.document.selection.createRange().text+=edit.document.selection.createRange().text}else alert('请选择一段文本')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('复制选择的某段文本')" onmouseout="hll('')"><input type=button value=删除 onclick="if(edit.document.selection.createRange().text!=''){edit.document.selection.createRange().text=''}else alert('请选择一段文本')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('删除选择的某段文本')" onmouseout="hll('')"><input type=button value=Help onClick="helpa()" style="width:40pt;background-color:aaaaaa;cursor:help"><select onClick="bbks.height=this.value"><option value="300">高度<option value="100">100<option value="150">150<option value="200">200<option value="250">250<option value="300" style="color:red">300<option value="350">350<option value="400">400<option value="450">450<option value="500">500</select><select onchange="edit.document.designMode=this.value"><option selected value='on'>工作状态<option value='on'>编辑状态<option value='off'>浏览状态</select><input type=checkbox style="background-color:aaaaaa" id=neweck onclick="if(eck.checked==false){if(this.checked){bbks.height=200;newtd.height=100;div1.style.visibility='';div1.style.zIndex='0';newa2.innerText='恢复'}else{bbks.height=300;newtd.height='';div1.style.visibility='hidden';div1.style.zIndex='-1';newa2.innerText='视窗'}}else{alert('此功能不可以在HTML编辑模式进行!');this.checked=false}" onmouseover="hll('选中进入学习html模式')" onmouseout="hll('')"><a id=newa2 style="font-size:12pt">视窗</a><input type=text name=newtime style="width:40pt;background-color:cccccc;cursor:text" disabled><span style="font-size:12pt"></font><input type=text name=zijie value=0字节 style="width:75pt" onclick="forzijie();edit.focus();"></td></tr><tr><td colspan=2><input type=button value="" onclick="loot('<b>'+edit.document.selection.createRange().text+'</b> ')" style="width:20pt;font-weight:900;" onmouseover="hll('加粗选中文本')" onmouseout="hll('')"><input type=button value="" onclick="loot('<I>'+edit.document.selection.createRange().text+'</I> ')" style="width:20pt;font-style:italic" onmouseover="hll('让选中文本倾斜')" onmouseout="hll('')"><input type=button value="A" onclick="loot('<u>'+edit.document.selection.createRange().text+'</u> ')" style="width:20pt;text-decoration:underline" onmouseover="hll('让选中文本加下划线')" onmouseout="hll('')"><input type=button value="A" onclick="loot('<s>'+edit.document.selection.createRange().text+'</s> ')" style="width:20pt;text-decoration:line-through" onmouseover="hll('让选中文本加删除线')" onmouseout="hll('')"><input type=button value="A" onclick="loot('<span style="text-decoration:overline">'+edit.document.selection.createRange().text+'</span> ')" style="width:20pt;text-decoration:overline" onmouseover="hll('让选中文本加上划线')" onmouseout="hll('')"><input type=button value="" onclick="loot(edit.document.selection.createRange().text.big()+' ')" style="width:20pt;font-size:11pt" onmouseover="hll('让选中文本变大')" onmouseout="hll('')"><input type=button value="" onclick="loot('<small>'+edit.document.selection.createRange().text+'</small> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本变小')" onmouseout="hll('')"><input type=button value="" onclick="loot(edit.document.selection.createRange().text.sup()+' ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本靠上显示')" onmouseout="hll('')"><input type=button value="" onclick="loot(edit.document.selection.createRange().text.sub()+' ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本靠下显示')" onmouseout="hll('')"><input type=button value="" onclick="maxH()" style="width:20pt;" onmouseover="hll('让选中文本成超连接')" onmouseout="hll('')"><input type=button value="大写" onclick="loot(edit.document.selection.createRange().text.toUpperCase())" style="width:25pt;font-size:9pt" onmouseover="hll('让选英文变成大写格式')" onmouseout="hll('')"><input type=button value="小写" onclick="loot(edit.document.selection.createRange().text.toLowerCase())" style="width:25pt;font-size:9pt" onmouseover="hll('让选英文变成小写格式')" onmouseout="hll('')"><input type=button value="" onclick="loot('<p align=left>'+edit.document.selection.createRange().text+'</p> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本向左缩进')" onmouseout="hll('')"><input type=button value="" onclick="loot('<center>'+edit.document.selection.createRange().text+'</center> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本居中缩进')" onmouseout="hll('')"><input type=button value="" onclick="loot('<p align=right>'+edit.document.selection.createRange().text+'</p> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本往右缩进')" onmouseout="hll('')"><select name=zihao onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxM()"><option value="" selected>字号<option value="8">8<option value="">9<option value="">9<option value="">10<option value="">10<option value="11">11<option value="12">12<option value="13">13<option value="14">14<option value="15">15<option value="16">16<option value="17">17<option value="18">18<option value="19">19<option value="20">20<option value="21">21<option value="22">22<option value="23">23<option value="25">25<option value="28">28<option value="30">30<option value="35">35<option value="40">40<option value="45">45<option value="50">50<option value="60">60<option value="70">70<option value="85">85<option value="100">100<option value="120">120<option value="150">150</select><select name=uyr onchange="maxI()" onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')"><option selected value="">粗度<option value=100>100<option value=200>200<option value=300>300<option value=400>400<option value=500>500<option value=600>600<option value=600>600<option value=700>700<option value=800>800<option value=900>900</select><select name=ytt onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxJ()"><option selected>字色<option style="BACKGROUND-COLOR: #666666" value=#666666></option><option style="BACKGROUND-COLOR: #999999" value=#999999></option><option style="BACKGROUND-COLOR: #cccccc" value=#cccccc></option><option style="BACKGROUND-COLOR: #f7f7f7" value=#f7f7f7></option><option style="BACKGROUND-COLOR: #990000" value=#990000></option><option style="BACKGROUND-COLOR: #cc0000" value=#cc0000></option><option style="BACKGROUND-COLOR: #ff0000" value=#ff0000></option><option style="BACKGROUND-COLOR: #ffff00" value=#ffff00></option><option style="BACKGROUND-COLOR: #ffff99" value=#ffff99></option><option style="BACKGROUND-COLOR: #ffffcc" value=#ffffcc></option><option style="BACKGROUND-COLOR: #0066cc" value=#0066cc></option><option style="BACKGROUND-COLOR: #0099ff" value=#0099ff></option><option style="BACKGROUND-COLOR: #00ccff" value=#00ccff></option><option style="BACKGROUND-COLOR: #006633" value=#006633></option><option style="BACKGROUND-COLOR: #009900" value=#009900></option><option style="BACKGROUND-COLOR: #00cc00" value=#00cc00></option><option style="BACKGROUND-COLOR: #ff6600" value=#ff6600></option><option style="BACKGROUND-COLOR: #ff9933" value=#ff9933></option><option style="BACKGROUND-COLOR: #ffcc66" value=#ffcc66></option><option style="BACKGROUND-COLOR: #cc0099" value=#cc0099></option><option style="BACKGROUND-COLOR: #cc00cc" value=#cc00cc></option><option style="BACKGROUND-COLOR: #cc33ff" value=#cc33ff></option><option style="background-color:yellow" value=yellow><option style="background-color:red" value=red> <opiton style="background-color:blue" value="blue"><opiton style="background-color:green" value=green><option style="background-color:orange" value="orange"><option style="background-color:black" value="black"><option style="background-color:white" value="white"><option style="background-color:gray" value="gray"><option style="background-color:lime" value="lime"><option style="background-color:navy" value="navy"><option style="background-color:purple" value="purple"><option style="background-color:maroon" value="maroon"><option style="background-color:#9addca" value="0addca"><option style="background-color:aadd9d" value="aadd9d"><option style="background-color:604599" value="604599"><option style="background-color:aaabbb" value="aaabbb"><option style="background-color:eebdac" value="eebdac"><option style="background-color:d9a9c9" value="d9a9c9"><option style="background-color:effeda" value="effeda"><option style="background-color:9d99ae" value="9d99ae"><option style="background-color:accccd" value="accccd"><option style="background-color:ce9423" value="ce9423"><option style="background-color:8aa9dd" value="9aa9dd"><option style="background-color:fedcba" value="fedcba"><option style="background-color:0f0eff" value="0f0eff"></select><select name=koob onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxK()" style="width:40pt"><option selected>字体<option value=黑体>黑体<option value=楷体_gb2312>楷体<option value=隶书>隶书<option value=仿宋_gb2312>仿宋<option value=Arial>Arial<option value="Arial Black">Arial<option value="Arial Narrow">Arial<option value="Comic Sans">Comic<option value="Courier New">Couri<option value=System>Syste<option value="Times New">Times<option value=Verdana>Verda<option value=Wingdings>图形<option value=Kantipur>Kanti</option></select><select name=bbiu onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxL()"><option selected value="">背景</option><option style="background-color:yellow" value=yellow><option style="background-color:red" value=red> <opiton style="background-color:blue" value="blue"> <opiton style="background-color:green" value=green><option style="background-color:orange" value="orange"><option style="background-color:black" value="black"><option style="background-color:white" value="white"><option style="background-color:gray" value="gray"><option style="background-color:lime" value="lime"><option style="background-color:navy" value="navy"><option style="background-color:purple" value="purple"><option style="background-color:maroon" value="maroon"><option style="background-color:#9addca" value="0addca"><option style="background-color:aadd9d" value="aadd9d"><option style="background-color:604599" value="604599"><option style="background-color:aaabbb" value="aaabbb"><option style="background-color:eebdac" value="eebdac"><option style="background-color:d9a9c9" value="d9a9c9"><option style="background-color:effeda" value="effeda"><option style="background-color:9d99ae" value="9d99ae"><option style="background-color:accccd" value="accccd"><option style="background-color:ce9423" value="ce9423"><option style="background-color:8aa9dd" value="9aa9dd"><option style="background-color:fedcba" value="fedcba"><option style="background-color:0f0eff" value="0f0eff"><option style="BACKGROUND-COLOR: #666666" value=#666666></option><option style="BACKGROUND-COLOR: #999999" value=#999999></option><option style="BACKGROUND-COLOR: #cccccc" value=#cccccc></option><option style="BACKGROUND-COLOR: #f7f7f7" value=#f7f7f7></option><option style="BACKGROUND-COLOR: #990000" value=#990000></option><option style="BACKGROUND-COLOR: #cc0000" value=#cc0000></option><option style="BACKGROUND-COLOR: #ff0000" value=#ff0000></option><option style="BACKGROUND-COLOR: #ffff00" value=#ffff00></option><option style="BACKGROUND-COLOR: #ffff99" value=#ffff99></option><option style="BACKGROUND-COLOR: #ffffcc" value=#ffffcc></option><option style="BACKGROUND-COLOR: #0066cc" value=#0066cc></option><option style="BACKGROUND-COLOR: #0099ff" value=#0099ff></option><option style="BACKGROUND-COLOR: #00ccff" value=#00ccff></option><option style="BACKGROUND-COLOR: #006633" value=#006633></option><option style="BACKGROUND-COLOR: #009900" value=#009900></option><option style="BACKGROUND-COLOR: #00cc00" value=#00cc00></option><option style="BACKGROUND-COLOR: #ff6600" value=#ff6600></option><option style="BACKGROUND-COLOR: #ff9933" value=#ff9933></option><option style="BACKGROUND-COLOR: #ffcc66" value=#ffcc66></option><option style="BACKGROUND-COLOR: #cc0099" value=#cc0099></option><option style="BACKGROUND-COLOR: #cc00cc" value=#cc00cc></option><option style="BACKGROUND-COLOR: #cc33ff" value=#cc33ff></option></select><select name=sppn onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="if(this.options[1].selected){var arv=prompt('请输入他的基本颜色,默认red,为红色,你也可以输入ffedff[粉红]做为颜色','red');this.options[1].value='glow(color='+arv+')'};if(this.options[3].selected){var arv1=prompt('请输入下落阴影的颜色,例如lime[亮绿]色的颜色代码,默认为白色','white');this.options[3].value='shadow(color='+arv1+')'};if(this.options[5].selected){var arv2=prompt('请输入立体文字的颜色,默认为black[黑色],你也可更改,例如改成red代码,他表示[红色]','black');this.options[5].value='dropshadow(color='+arv2+')'};maxN()" onmouseover="hll('给选中文本加些特殊效果')" onmouseout="hll('')"><option selected value="">效果<option value="glow">光晕<option value="blur">模糊<option value="shadow">阴影<option value="alpha(opacity=10)">透明<option value="dropshadow">立体</select></td></tr><tr><td id=fortab></td></tr><tr><td id=bbks height=300><table cellspacing=0 cellpadding=0 align=left align=top width=10 height=100%><tr><Td><input type=button value= onClick="edit.document.body.innerHTML+='<br>';edit.focus();" style="background-color:#bbbbbb;width:20pt;height:10%" onmouseover="hll('单击编辑窗口[换一行]')" onmouseout="hll('')"><br><input type=button value="." onClick="edit.document.body.innerHTML+=' ';edit.focus()" style="background-color:#bbbbbb;width:20pt;height:10%" onmouseover="hll('单击编辑窗口[空一格]')" onmouseout="hll('')"><br><input type=button value="" onClick="if(eck.checked==false){var hrtt=prompt('请输入[水平线的颜色]HTML代码,例如输入red代表红色,如果任何不输入则默认水平线颜色为gray[灰色]','');edit.document.body.innerHTML+='<hr size=2 color="'+hrtt+'" style="">'}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入[水平线]')" onmouseout="hll('')"><br><input type=button value= onClick="if(eck.checked==false){img11()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入图片')" onmouseout="hll('')"><br><input type=button value="~~" onClick="if(eck.checked==false){mar()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入动画字幕')" onmouseout="hll('')"><br><input type=button value="" onclick="if(eck.checked==false){fortab1()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入表格,值请自行修改')" onmouseout="hll('')"><br><input type=button value="E" onclick="if(eck.checked==false){var mail=prompt('请输入电子邮件地址',' @ .com');edit.document.body.innerHTML+='<a href=mailto:'+mail+'>与我联系</a>'}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入启动outlook邮件')" onmouseout="hll('')"><br><input type=button value="" onclick="if(eck.checked==false){forme1()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入浮动窗口iframe')" onmouseout="hll('')"><br><input type=button value="" onclick="if(eck.checked==false){edit.document.body.innerHTML+='<div style="position:absolute;top:30px;left:35px;width:300;height:200;z-index:2;background-color:eeeeee;overflow:scroll;" id=div1>请修改他的元素属性</div>';alert('[立体图层]已经插入,你可单击浏览网页查看样式,修改请进入HTML编辑模式')}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入一个立体图层')" onmouseout="hll('')"><br><input type=button value= onClick="if(eck.checked==false){edit.document.body.innerHTML+='<embed src="rtsp://ent.online.ln.cn/ent.online.ln.cn/LegendofZu_01.rm" type="audio/x-pn-realaudio-plugin" console=Clip1 controls=IMAGEWINDOW,ControlPanel,StatusBar height=200 width=200 autostart=true></embed>';alert('[realplayer播放器]已经插入,你可单击浏览网页查看正播放的电影,修改请进入HTML编辑模式,如果想保持播放器正常,你必须装有realplayer播放器软件')}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入一个多媒体播放器')" onmouseout="hll('')"></td></tr></table><iframe id=edit width=100% height=100% marginwidth=0 marginheight=0 frameborder=1></iframe></td></tr><Tr><Td id=newtd align=left><div style="position:absolute;z-index:-1;background-color:dddddd;overflow:scroll;visibility:hidden;width:100%;height:100%" id=div1 align=left onmouseover="hll('原代码显示图层')" onmouseout="hll('')"></div></td></tr><tr><td colspan=2 width="787"><input type=checkbox onClick="if(neweck.checked==false){if(this.checked){edit.document.body.style.fontSize='12pt';edit.document.body.style.fontFamily='System';var kaocao=edit.document.body.innerHTML;edit.document.body.innerText='<html>\n<head>\n<title>欢迎光临我的主页</title>\n<META http-equiv=Content-Type content=text/html; charset=gb2312>\n<!--this webpage work by http://csylw.home.sohu.com/1/2/web.html-->\n<style type=text/css>\nbody,th,td{font-size:'+cs2.value+';color:'+cs3.options[cs3.selectedIndex].value+';font-family:'+cs4.options[cs4.selectedIndex].value+';}\na.link{color:'+cs5.options[cs5.selectedIndex].value+';text-decoration:none;}\nimg{}\ninput{}\n</style>\n</head>\n<body topmargin=2 leftmargin=2 bgcolor='+cs9.options[cs9.selectedIndex].value+' background='+cs10.value+'>\n\n'+kaocao+'\n\n</body>\n</html>';newa.innerText='选中进入皮肤编辑模式'}else{edit.document.body.style.fontSize=cs2.value;edit.document.body.style.fontFamily=cs4.value;edit.document.body.innerHTML=edit.document.body.innerText;newa.innerText='选中进入HTML编辑模式'}}else{alert('请把视窗功能关闭!否则不可进行');this.checked=false}" id="eck" onmouseover="hll('编辑状态的切换方式')" onmouseout="hll('')"><a id=newa>选中进入HTML编辑模式</a> <a style="color:red;cursor:hand;" onClick="if(eck.checked==false){var asb=edit.document.body.innerHTML;op=window.open('','newin','');op.document.open();op.focus();op.document.write('<html>\n<head>\n<title>欢迎光临我的网页</title>\n<META http-equiv=Content-Type content=text/html; charset=gb2312>\n<!--this webpage work by http://csylw.home.sohu.com/1/2/web.html-->\n<style type=text/css>\nbody,th,td{font-size:'+cs2.value+';color:'+cs3.options[cs3.selectedIndex].value+';font-family:'+cs4.options[cs4.selectedIndex].value+';}\na{color:'+cs5.options[cs5.selectedIndex].value+';text-decoration:none;}\nimg{}\ninput{}\n</style>\n</head>\n<body topmargin=2 leftmargin=2 bgcolor='+cs9.options[cs9.selectedIndex].value+' background='+cs10.value+'>\n\n'+asb+'\n\n</body>\n</html>');op.document.close()}else {var asb=edit.document.body.innerHTML;op=window.open('','newin','');op.document.open();op.focus();op.document.write(edit.document.body.innerText);op.document.close()}" onMouseOver="this.style.color='white';hll('查看在浏览器运行的效果')" onMouseOut="this.style.color='red';hll('')" id="liulan">浏览网页</a> <input type=button value=Enter onClick="if(eck.checked==false){if(iiss.options[0].selected==false){edit.document.body.innerHTML+=iiss.value}else alert('[选择表单]无数据,请选择他覆盖的元素')}else alert('此功能不可以在HTML编辑模式使用')" style="width:35pt"><select id=iiss><option selected>选择表单<option value="<input type=text name='' size=''>">小文本框<option value="<textarea cols='25' rows='3' name=''

 

0 Comments

Fri

20

Mar

2009

67、英汉翻译器

67、英汉翻译器

脚本说明:

把如下代码加入<body>区域中

<script language="JavaScript">

 

<!-- ;

 

function asd(word)

 

{

 

document.f1.sWord.value= word

 

 

 

}

 

 

 

function translate()

 

{

 

var e= document.f1.eWord.value ;

 

e= new String(e) ;

 

e= e.toLowerCase();

 

 

 

switch (e)

 

{

 

case "who":

 

asd("")

 

break;

 

 

 

case 'what':

 

asd('什么');

 

break;

 

 

case 'dog':

 

asd('')

 

break;

 

 

 

case 'lunch':

 

asd('午饭')

 

break;

 

 

 

 

case 'hello':

 

asd('你好')

 

break;

 

 

 

case 'bye':

asd('再见')

 

break;

 

 

 

case 'head':

 

asd('')

 

break;

 

 

 

case 'face':

 

asd('')

 

break;

 

 

 

case 'nose':

 

asd('鼻子')

 

break;

 

 

 

case 'mouth':

 

asd('')

 

break;

 

 

 

case 'ear':

 

asd('耳朵')

 

break;

 

 

 

case 'eye':

 

asd('眼睛')

 

break;

 

 

 

// 20 wrds approx so far

 

 

case 'computer':

 

asd('电脑')

 

break;

 

 

case 'cat':

 

asd('')

 

break;

 

 

case 'today':

 

asd('今天')

 

break;

 

// 30

 

 

 

case 'window':

 

asd('窗子')

 

break;

 

 

 

case 'right':

 

asd('右、正确')

 

break;

 

 

 

 

case 'book':

 

asd('')

 

break;

 

 

 

// 40

 

 

 

case 'notebook':

 

asd('笔记本')

 

break;

 

 

 

case 'paper':

 

asd('纸张')

 

break;

 

 

case 'park':

 

asd('公园')

 

break;

 

 

 

case 'sorry':

 

asd('对不起')

 

break;

 

 

 

case 'good luck':

 

asd('祝好运')

 

break;

 

 

 

case 'work':

 

asd('工作')

 

break;

 

 

 

case 'task':

 

asd('任务')

 

break;

 

 

 

 

case 'foot':

 

asd('')

 

break;

 

 

 

case 'good':

 

asd('好的')

 

break;

 

 

 

case 'bad':

 

asd('坏的')

 

break;

 

 

 

case 'flag':

 

asd('旗子')

 

break;

 

 

 

case 'station':

 

asd('停车场')

 

break;

 

 

 

case 'smoke':

 

asd('吸烟')

 

break;

 

 

 

case 'shirt':

 

asd('衬衣')

 

break;

 

 

 

case 'trousers':

asd('裤子')

 

break;

 

 

 

case 'dictionary':

 

asd('辞典')

 

break;

 

 

 

}

 

}

 

 

 

// end hide -->

 

</script>

 

<form name="f1">

<input type="text" name="eWord" size="10" maxlength="50">   --->

<input type="text" name="sWord" size="10" maxlength="50">

<input type="button" value="翻译" onclick="translate()">

</form><br>

你可以输入dog,hello,sorry试试,字库有限

</center>

 

0 Comments

Fri

20

Mar

2009

66、搜索黑色星期五

66、搜索黑色星期五

脚本说明:

第一步:把如下代码加入<body>区域中

       <style>

 

              #InternalDiv {position:relative;width:250px;height:1px;color:blue;background-color:#FDF5E6;border-style:double;border-color:blue;padding-top:5px;padding-left:5px;padding-right:5px;padding-bottom:5px;margin:3px;visibility:visible;z-index:10;top:50;left:0;}

 

       </style>

 

       <script>

 

       function startitup() {

 

              var BasicHTML = "<center>这里是搜索结果显示区</center>"

 

              document.all["InternalDiv"].innerHTML = BasicHTML;

 

              }

 

       </script>

 

<script>

 

 

 

var new_Date=new Date()

 

//var DOW=new_Date.getDay()+1

 

var DOM=new_Date.getDate()

 

//var Month=new_Date.getMonth()+1

 

var Year=new_Date.getFullYear()

 

var LongMonth = new Array("January","February","March","April","May","June","July","August","September","October","November","December")

 

var LongDay = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")

 

var setTimer = 5000;

 

 

 

function find13th() {

 

       var Start = startyear.value

 

       var End = endyear.value

 

       var TooMuch = End-Start

 

       //alert(TooMuch)

 

       if (confirm("搜索过程也许需要些时间,请耐心等待..."))

 

              if (End < Start)                                         //if end<start alert user, else

 

                     alert("对不起,起始日期应该比结束日期大")

 

              else {                                                              //allow dates and continue

 

                     var BasicHTML = "<center><u>搜索结果</u>"

 

                     for (YearTest=Start;YearTest<=End;YearTest++) {

 

                            if (MonthSelect.value==20) {

 

                                   for (MonthTest=0;MonthTest<=11;MonthTest++) {

 

                                          var TestDate = new Date(YearTest,MonthTest,13)

 

                                          if (TestDate.getDay()==5)

 

                                          BasicHTML = BasicHTML+"<br>"+LongMonth[MonthTest]+" "+TestDate.getDate()+", "+YearTest

 

                                   }

 

                            }

 

                            else {

 

                                   var TestDate = new Date(YearTest,MonthSelect.value,13)

 

                                   if (TestDate.getDay()==5)

 

                                   BasicHTML = BasicHTML+"<br>"+LongMonth[MonthSelect.value]+" "+TestDate.getDate()+", "+YearTest

 

                            }

 

                     }

 

                     document.all["InternalDiv"].innerHTML = BasicHTML;    

 

              }

 

       else {

 

              alert("Please make the years closer together..")

 

       }

 

}

 

function clearResults() {

 

       var BasicHTML = "<center>这里是结果显示区</center>"

 

       document.all["InternalDiv"].innerHTML = BasicHTML;

 

}

 

</script>

输入开始年份:

<input type="Text" size="5" maxlength="4" name="startyear" value="2002">

<br><br>

输入结束年份:

<input type="Text" size="5" maxlength="4" name="endyear" value="2002">

<br><br>

请选择具体月份:

<select NAME="MonthSelect" size="1" style="HEIGHT: 22px; WIDTH: 130px">

       <option VALUE ="20" SELECTED>所有月份</option>

       <option value="0">January</option>

       <option value="1">February</option>

       <option value="2">March</option>

       <option value="3">April</option>

       <option value="4">May</option>

       <option value="5">June</option>

       <option value="6">July</option>

       <option value="7">August</option>

       <option value="8">September</option>

       <option value="9">October</option>

       <option value="10">November</option>

       <option value="11">December</option>

</select><br><br>

<input type="Button" value="搜索结果" onmouseup="find13th()">

    <input type="Button" value="清除结果" onmouseup="clearResults()">

<layer id="Layer1"><div id="InternalDiv"></div></layer>

 

 

 

第二步:把<body>中的内容改为:

<BODY onLoad="startitup()">

 

0 Comments

Fri

20

Mar

2009

65、圣诞树

65、圣诞树

脚本说明:

把如下代码加入<body>区域中

<STYLE>

 

BLOCKQUOTE {font-weight:900; line-height:0.75em}

 

</STYLE>

<BLOCKQUOTE><FONT COLOR=YELLOW><CENTER>

 

    *<BR>

 

*  *  *<BR>

 

  *  *<BR>

 

<FONT COLOR=GREEN>

 

<SCRIPT LANGUAGE="JavaScript">

 

<!--

 

var Number=Math.random()*10+3;

 

var Length=Math.round(Number)

 

var width=1;

 

for (i=0; i<=Length; i++)

 

{

 

       for (x=0; x<=4; x++)

 

       {

 

              for (y=1; y<=width; y++)

 

              {

 

              var NewNumber=Math.random()*15;

 

              var Ornament=Math.round(NewNumber);

 

              if (Ornament<=1)

 

              {

 

              document.write("</FONT><FONT COLOR=RED> ^</FONT><FONT COLOR=GREEN>");

 

              }

 

              if (Ornament>=2){

 

              document.write(" ^");

 

              }

 

              }

 

       document.write("<BR>");

 

       var width=width+1;

 

       }

 

var width=width-2;

 

}

 

//-->

 

</SCRIPT>

 

</CENTER></FONT></BLOCKQUOTE>

 

0 Comments

Fri

20

Mar

2009

64、加密mail地址

64、加密mail地址

脚本说明:

把如下代码加入<body>区域中

<style type="text/css">

<!--

p,form,input,textarea {

   font-family: verdana, arial, helvetica, sans-serif;

   font-size: 12px;

}

-->

</style>

<script language="JavaScript">

<!--

function str2hex(s) {

   var a,b,d;

   var hexStr = '';

   for (var i=0; i < s.length; i++) {

      d = s.charCodeAt(i);

      a = d % 16;

      b = (d - a)/16;

      hexStr += '%' + "0123456789ABCDEF".charAt(b) + "0123456789ABCDEF".charAt(a);

   }

   return hexStr;

}

function encode() {

 

   var s0 = document.f1.str.value;

 

   var encod;

 

   document.f1.encoded.value = encod = str2hex(s0);

 

 

 

   s0 = s0.replace(/\@/,' at ');

 

   s0 = s0.replace(/\./g,' dot ');

 

 

 

   document.f1.all.value =

 

      '<a href="mailto:' + encod + '">yourTEXThere</a>' + '\r' +

 

      '<!-- ' + s0 + ' -->';

 

}

//-->

 

</script>

<form name="f1">

<p><font color="#CC0000">请输入一个正确的E-mail地址:</font><br>

<input type="text" name="str" size="60" onchange="encode()"></p>

<p><font color="#CC0000">加密后的代码为:</font><br>

<input type="text" name="encoded" size="60"></p>

<p><font color="#CC0000">完整的HTML代码</font><br>

<textarea rows="4" name="all" cols="60">

 

0 Comments

Thu

19

Mar

2009

63、左侧的变化菜单

63、左侧的变化菜单

<html xmlns="http://www.w3.org/1999/xhtml">

 

  <head>

 

    <title>web reference</title>

 

    <script language="JavaScript1.2" type="text/javascript">

 

      var maxmnus = 5

 

      function opTab(){

 

        var mnu = document.getElementById("menubar")

 

        var arrdiv = document.getElementById("arrow")

 

        var arrtxt = document.getElementById("arr")

 

        if((mnu.style.display != "block") || (mnu.style.display == "")){

 

          mnu.style.display = "block"

 

          arrdiv.style.pixelLeft = mnu.style.width.substring(0 , mnu.style.width.length - 2)

 

          arrtxt.innerText = "3";

 

        } else {

 

          mnu.style.display = "none"

 

          arrtxt.innerText = "4";

 

          arrdiv.style.pixelLeft = 0;

 

        }

 

        event.cancelBubble = true;

 

      }

 

 

 

      function toggleMenu(el){

 

        for(var i = 0;i < maxmnus;i++) document.getElementById(document.getElementById("c" + i).menu).style.display = "none";

 

        if(el.status == "closed"){

 

          el.status = "open"

 

          document.getElementById(el.menu).style.display = "block";

 

        } else {

 

          el.status = "closed"

 

        }

 

      }

 

     

 

      function toggleSub(e){

 

        el = document.getElementById(e)

 

        if(el.status == "closed"){

 

          el.style.display = "block";

 

          el.status = "open"

 

        } else {

 

          el.style.display = "none";

 

          el.status = "closed"

 

        }       

 

        event.cancelBubble = true;

 

      }

 

    </script>

 

    <style type="text/css">

 

      #menubar{position:absolute;top:0px;left:0px;display:none;font-family:Verdana,Helvetica,Arial;font-weight:700;font-size:10px;cursor:hand;z-index:5;background-image:url(http://www.diades.co.uk/freestuff/mnu.jpg);background-repeat:repeat-y;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',gradientType='1',startColorstr='#2644b2', endColorstr='#e7e8f1');}

 

      .indicator{color:#b24426;font-family:Webdings;font-weight:bold;font-size:10px;}

 

      .r1{position:relative;top:10px;left:5px;width:213px;color:#e7e8f1;border-left:#e7e8f1 2px outset;border-top:#e7e8f1 2px outset;border-right:#e7e8f1 2px outset;border-bottom:#e7e8f1 2px outset;padding-left:5px;padding-top:1px;adding-right:5px;padding-bottom:1px;background-image:url(http://www.diades.co.uk/freestuff/mnu.jpg);background-repeat:repeat-y;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',gradientType='1',startColorstr='#2644b2', endColorstr='#e7e8f1');}

 

      .submenu1{position:relative;top:0px;left:0px;height:95%;width:100%;border-left:#e0f8e3 2px inset;border-top:#e0f8e3 2px inset;border-right:#e0f8e3 2px inset;border-bottom:#e0f8e3 2px inset;padding-left:3px;padding-top:3px;padding-right:3px;padding-bottom:3px;display:none;color:#2644b2;font-family:Verdana,Helvetica,Arial;font-weight:700;font-size:10px;background-color:#cff1d4;background-image:url(http://www.diades.co.uk/freestuff/sub.jpg);background-repeat:repeat-y;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',gradientType='1',startColorstr='#bec1e4', endColorstr='#e7e8f1');}

 

      .submenu2{position:relative;top:0px;left:0px;width:90%;border-left:#e0f8e3 3px groove;border-top:#e0f8e3 3px groove;border-right:#e0f8e3 3px groove;border-bottom:#e0f8e3 3px groove;padding-left:3px;padding-top:3px;padding-right:3px;padding-bottom:3px;margin-top:4px;display:none;background-color:#cff1d4;color:#2644b2;font-family:Verdana,Helvetica,Arial;font-weight:700;font-size:10px;background-image:url(http://www.diades.co.uk/freestuff/sub.jpg);background-repeat:repeat-y;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',gradientType='1',startColorstr='#bec1e4', endColorstr='#e7e8f1');}

 

      .pulltab{position:absolute;top:0px;left:0px;height:100%;width:20px;padding-left:2px;cursor:hand;color:#2644b2;font-family:Webdings;font-weight:bold;font-size:10px;z-index:5;background-image:url(http://www.diades.co.uk/freestuff/tab.jpg);background-repeat:repeat-y;filter:progid:DXImageTransform.Microsoft.gradient(enabled='true',gradientType='1',startColorstr='#e7e8f1', endColorstr='#2644b2');}

 

      .inner{height:100%;width:100%;}

 

      .mtab{position:relative;top:0px;

 

      .btninner{height:100%;width:100%;}

 

      .fr{position:absolute;top:0px;left:30px;}

 

    </style>

 

  </head>

 

  <body scroll="no">

 

    <div id="menubar" style="; HEIGHT: expression(document.body.offsetHeight); WIDTH: 223px">

 

      <div id="c0" class="r1" onclick="toggleMenu(this)" status="closed" menu="m0">

 

        <div id="cbtn" class="btninner">Behaviors</div>

 

        <div class="mtab">

 

          <table id="m0" class="submenu1" align="center" border="0" cellspacing="0" cellpadding="0">

 

            <tr><td onclick="opTab();">DHTML Behaviours</td></tr>

 

            <tr><td onclick="opTab();">HTC Reference</td></tr>

 

            <tr><td onclick="opTab();">Element Behaviors</td></tr>

 

            <tr><td onclick="toggleSub('m0s0');">ViewLink Overview<span class="indicator">6</span>

 

                <table id="m0s0" class="submenu2" align="center" border="0" cellspacing="0" cellpadding="0" status="closed">

 

                  <tr><td onclick="opTab();">ViewLink CSS Inheritance</td></tr>

 

                </table></td></tr>

 

            <tr><td onclick="opTab();">Default Behaviors Reference</td></tr>

 

            <tr><td onclick="opTab();">Behaviors Library</td></tr>

 

            <tr><td onclick="opTab();">Using DHTML behaviors</td></tr>

 

            <tr><td onclick="opTab();">Implementing DHTML Behaviors in Script Using HTML Components</td></tr>

 

          </table>

 

        </div>

 

      </div>

 

      <div id="c1" class="r1" onclick="toggleMenu(this)" status="closed" menu="m1">

 

        <div id="cbtn" class="btninner">CSS</div>

 

        <div>

 

          <table id="m1" class="submenu1" align="center" border="0" cellspacing="0" cellpadding="0">

 

            <tr><td onclick="opTab();">A Coast-to-Coast Cascade of Style Sheets</td></tr>

 

            <tr><td onclick="opTab();">Using Cascading Style Sheets</td></tr>

 

            <tr><td onclick="opTab();">Controlling Presentation with Measurement and Location Properties</td></tr>

 

            <tr><td onclick="opTab();">A User's Guide to Style Sheets</td></tr>

 

            <tr><td onclick="opTab();">Cascading Style Sheets in Internet Explorer 4.0</td></tr>

 

            <tr><td onclick="opTab();">New in CSS, Level 2</td></tr>

 

            <tr><td onclick="opTab();">CSS Positioning</td></tr>

 

            <tr><td onclick="opTab();">Linked Style Sheets</td></tr>

 

            <tr><td onclick="opTab();">Using Vertical Layout in Internet Explorer 5.5</td></tr>

 

            <tr><td onclick="opTab();">CSS Attributes Reference</td></tr>

 

            <tr><td onclick="opTab();">CSS Length Units Reference</td></tr>

 

            <tr><td onclick="opTab();">Tips</td></tr>

 

          </table>

 

        </div>

 

      </div>

 

      <div id="c2" class="r1" onclick="toggleMenu(this)" status="closed" menu="m2">

 

        <div id="cbtn" class="btninner">DHTML</div>

 

        <div>

 

          <table id="m2" class="submenu1" align="center" border="0" cellspacing="0" cellpadding="0">

 

            <tr><td>DHTML 1</td></tr>

 

            <tr><td>DHTML 2</td></tr>

 

            <tr><td>DHTML 3</td></tr>

 

            <tr><td>DHTML 4</td></tr>

 

            <tr><td>DHTML 5</td></tr>

 

            <tr><td>DHTML 6</td></tr>

 

            <tr><td>DHTML 7</td></tr>

 

            <tr><td>DHTML 8</td></tr>

 

            <tr><td>DHTML 9</td></tr>

 

            <tr><td>DHTML 10</td></tr>

 

            <tr><td>DHTML 11</td></tr>

 

            <tr><td>DHTML 12</td></tr>

 

          </table>

 

        </div>

 

      </div>

 

      <div id="c3" class="r1" onclick="toggleMenu(this)" status="closed" menu="m3">

 

        <div id="cbtn" class="btninner">DOM</div>

 

        <div>

 

          <table id="m3" class="submenu1" align="center" border="0" cellspacing="0" cellpadding="0">

 

            <tr><td>DOM 1</td></tr>

 

            <tr><td>DOM 2</td></tr>

 

            <tr><td>DOM 3</td></tr>

 

            <tr><td>DOM 4</td></tr>

 

            <tr><td>DOM 5</td></tr>

 

            <tr><td>DOM 6</td></tr>

 

            <tr><td>DOM 7</td></tr>

 

            <tr><td>DOM 8</td></tr>

 

            <tr><td>DOM 9</td></tr>

 

            <tr><td>DOM 10</td></tr>

 

            <tr><td>DOM 11</td></tr>

 

            <tr><td>DOM 12</td></tr>

 

          </table>

 

        </div>

 

      </div>

 

      <div id="c4" class="r1" onclick="toggleMenu(this)" status="closed" menu="m4">

 

        <div id="cbtn" class="btninner">HTML</div>

 

        <div>

 

          <table id="m4" class="submenu1" align="center" border="0" cellspacing="0" cellpadding="0">

 

            <tr><td>HTML 1</td></tr>

 

            <tr><td>HTML 2</td></tr>

 

            <tr><td>HTML 3</td></tr>

 

            <tr><td>HTML 4</td></tr>

 

            <tr><td>HTML 5</td></tr>

 

            <tr><td>HTML 6</td></tr>

 

            <tr><td>HTML 7</td></tr>

 

            <tr><td>HTML 8</td></tr>

 

            <tr><td>HTML 9</td></tr>

 

            <tr><td>HTML 10</td></tr>

 

            <tr><td>HTML 11</td></tr>

 

            <tr><td>HTML 12</td></tr>

 

          </table>

 

        </div>

 

      </div>

 

    </div>

 

    <div id="arrow" class="pulltab" onclick="opTab()"><table class="inner"><tr><td id="arr" valign="middle">4</td></tr></table></div>

 

    <div id="fr" name="fr" class="fr">

 

      <h2>左侧的变化菜单</h2>

 

      <p>This menu is specifically designed for IE5.5+, there will be a version for N6+ and Mozilla 0.9.2 soon</p>

 

      <ol>

 

      <li>Click on the bar to the left to open or close the menu</li>

 

      <li>Clicking on any menu item would normally display a page here and/or show a submenu indicated by a down arrow at Jon Steele's suggestion</li>

 

      <li>The fourth item of the "Behavoirs" menu, "Viewlink Overview" has a sub-menu.</li>

 

      <li>No menu will remain open if another is clicked</li>

 

      <li>Clicking on the same menu item toggles it open or closed accordingly</li>

 

      <li>Selection of a link closes the menu automatically</li>

 

      <li>The IE 5.5 version, uses no images, the colouration is from a behavior that requires 5.5</li>

 

      <li>The 5.0 version uses 2 small jpg but are of lesser quality.</li>

 

      <li>This menu is designed, primarily, for dynamic page. The adat for the page would either be placed here via XML or arrays or document/write method.

 

      </ol>

 

    </div>

 

0 Comments

Thu

19

Mar

2009

62、图片的任意方向移动

62、图片的任意方向移动

脚本说明:

把如下代码加入<body>区域中

<table>

<tr><td style="padding: 5">

<div id="testDiv" style="border: buttonface 2 solid">

<img src="2201.jpg">

</div>

<script language="JScript">

function scroll(obj, oWidth, oHeight, direction, drag, zoom, speed)

{

       var scrollDiv          = obj

       var scrollContent    = document.createElement("span")

       scrollContent.style.position = "absolute"

       scrollDiv.applyElement(scrollContent, "inside")

       var displayWidth    = (oWidth  != "auto" && oWidth ) ? oWidth  : scrollContent.offsetWidth  + parseInt(scrollDiv.currentStyle.borderRightWidth)

       var displayHeight   = (oHeight != "auto" && oHeight) ? oHeight : scrollContent.offsetHeight + parseInt(scrollDiv.currentStyle.borderBottomWidth)

       var contentWidth    = scrollContent.offsetWidth

       var contentHeight   = scrollContent.offsetHeight

       var scrollXItems     = Math.ceil(displayWidth  / contentWidth)  + 1

       var scrollYItems     = Math.ceil(displayHeight / contentHeight) + 1

 

       scrollDiv.style.width      = displayWidth

       scrollDiv.style.height     = displayHeight

       scrollDiv.style.overflow = "hidden"

       scrollDiv.setAttribute("state", "stop")

       scrollDiv.setAttribute("drag", drag ? drag : "horizontal")

       scrollDiv.setAttribute("direction", direction ? direction : "left")

       scrollDiv.setAttribute("zoom", zoom ? zoom : 1)

       scrollContent.style.zoom = scrollDiv.zoom

      

       var scroll_script =  "var scrollDiv = " + scrollDiv.uniqueID                                                                      +"\n"+

                            "var scrollObj = " + scrollContent.uniqueID                                                         +"\n"+

                            "var contentWidth = " + contentWidth + " * (scrollObj.runtimeStyle.zoom ? scrollObj.runtimeStyle.zoom : 1)"       +"\n"+

                            "var contentHeight = " + contentHeight + " * (scrollObj.runtimeStyle.zoom ? scrollObj.runtimeStyle.zoom : 1)"       +"\n"+

                            "var scrollx = scrollObj.runtimeStyle.pixelLeft"                                                   +"\n"+

                            "var scrolly = scrollObj.runtimeStyle.pixelTop"                                                           +"\n"+

 

                            "switch (scrollDiv.state.toLowerCase())"                                                       +"\n"+

                            "{"                                                                                      +"\n"+

                                   "case ('scroll')  :"                                                             +"\n"+

                                          "switch (scrollDiv.direction)"                                                        +"\n"+

                                          "{"                                                                        +"\n"+

                                                 "case ('left')            :"                                               +"\n"+

                                                        "scrollx = (--scrollx) % contentWidth"                             +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "case ('right')   :"                                                      +"\n"+

                                                        "scrollx = -contentWidth + (++scrollx) % contentWidth"                  +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "case ('up')      :"                                                      +"\n"+

                                                        "scrolly = (--scrolly) % contentHeight"                                   +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "case ('down')  :"                                                      +"\n"+

                                                        "scrolly = -contentHeight + (++scrolly) % contentHeight"         +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "case ('left_up')      :"                                               +"\n"+

                                                        "scrollx = (--scrollx) % contentWidth"                             +"\n"+

                                                        "scrolly = (--scrolly) % contentHeight"                                   +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "case ('left_down')  :"                                               +"\n"+

                                                        "scrollx = (--scrollx) % contentWidth"                             +"\n"+

                                                        "scrolly = -contentHeight + (++scrolly) % contentHeight"         +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "case ('right_up')    :"                                               +"\n"+

                                                        "scrollx = -contentWidth + (++scrollx) % contentWidth"                  +"\n"+

                                                        "scrolly = (--scrolly) % contentHeight"                                   +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "case ('right_down')       :"                                               +"\n"+

                                                        "scrollx = -contentWidth + (++scrollx) % contentWidth"                  +"\n"+

                                                        "scrolly = -contentHeight + (++scrolly) % contentHeight"         +"\n"+

                                                        "break"                                                           +"\n"+

                                                 "default          :"                                               +"\n"+

                                                        "return"                                                    +"\n"+

                                          "}"                                                                        +"\n"+

                                          "scrollObj.runtimeStyle.left = scrollx"                                            +"\n"+

                                          "scrollObj.runtimeStyle.top = scrolly"                                            +"\n"+

                                          "break"                                                                         +"\n"+

      

                                   "case ('stop')    :"                                                                    +"\n"+

                                   "case ('drag')   :"                                                                    +"\n"+

                                   "default   :"                                                                    +"\n"+

                                          "return"                                                                  +"\n"+

                            "}"

      

       var contentNode = document.createElement("span")

       contentNode.runtimeStyle.position = "absolute"

       contentNode.runtimeStyle.width = contentWidth

       scrollContent.applyElement(contentNode, "inside")

       for (var i=0; i <= scrollXItems; i++)

       {

              for (var j=0; j <= scrollYItems ; j++)

              {

                     if (i+j == 0)    continue

                     var tempNode = contentNode.cloneNode(true)

                     var contentLeft, contentTop

                     scrollContent.insertBefore(tempNode)

                     contentLeft = contentWidth * i

                     contentTop = contentHeight * j

                     tempNode.runtimeStyle.left = contentLeft

                     tempNode.runtimeStyle.top  = contentTop

              }

       }

 

       scrollDiv.onpropertychange = function()

       {

              var propertyName = window.event.propertyName

              var propertyValue = eval("this." + propertyName)

             

              switch(propertyName)

              {

                     case "zoom"           :

                            var scrollObj = this.children[0]

                            scrollObj.runtimeStyle.zoom = propertyValue

                            var content_width  = scrollObj.children[0].offsetWidth  * propertyValue

                            var content_height = scrollObj.children[0].offsetHeight * propertyValue

                            scrollObj.runtimeStyle.left = -content_width  + (scrollObj.runtimeStyle.pixelLeft % content_width)

                            scrollObj.runtimeStyle.top  = -content_height + (scrollObj.runtimeStyle.pixelTop  % content_height)

                            break

              }

       }

      

       scrollDiv.onlosecapture = function()

       {

              this.state = this.tempState ? this.tempState : this.state

              this.runtimeStyle.cursor = ""

              this.removeAttribute("tempState")

              this.removeAttribute("start_x")

              this.removeAttribute("start_y")

              this.removeAttribute("default_left")

              this.removeAttribute("default_top")

       }

      

       scrollDiv.onmousedown = function()

       {

              if (this.state != "drag")   this.setAttribute("tempState", this.state)

              this.state = "drag"

              this.runtimeStyle.cursor = "default"

              this.setAttribute("start_x", event.clientX)

              this.setAttribute("start_y", event.clientY)

              this.setAttribute("default_left", this.children[0].style.pixelLeft)

              this.setAttribute("default_top", this.children[0].style.pixelTop)

              this.setCapture()

       }

      

       scrollDiv.onmousemove = function()

       {

              if (this.state != "drag")   return

              var scrollx = scrolly = 0

              var zoomValue = this.children[0].style.zoom ? this.children[0].style.zoom : 1

              var content_width = this.children[0].children[0].offsetWidth * zoomValue

              var content_Height = this.children[0].children[0].offsetHeight * zoomValue

              if (this.drag == "horizontal" || this.drag == "both")

              {

                     scrollx = this.default_left + event.clientX - this.start_x

                     scrollx = -content_width + scrollx % content_width

                     this.children[0].runtimeStyle.left = scrollx

              }

              if (this.drag == "vertical" || this.drag == "both")

              {

                     scrolly = this.default_top + event.clientY - this.start_y

                     scrolly = -content_Height + scrolly % content_Height

                     this.children[0].runtimeStyle.top = scrolly

              }

       }

      

       scrollDiv.onmouseup = function()

       {

              this.releaseCapture()

       }

      

       scrollDiv.state = "scroll"

       setInterval(scroll_script, speed ? speed : 20)

}

</script>

<script language="JScript">

window.onload = new Function("scroll(document.all['testDiv'], 325)")

</script>

<br>

<button onclick="testDiv.direction='up'; testDiv.state='scroll'"><span style="font-family: Webdings">5</span>向上</button>

<button onclick="testDiv.direction='left'; testDiv.state='scroll'"><span style="font-family: Webdings">3</span>向左</button>

<button onclick="testDiv.state='stop'"><span style="font-family: Webdings">;</span>停止</button>

<button onclick="testDiv.state='scroll'"><span style="font-family: Webdings">8</span>播放</button>

<button onclick="testDiv.direction='right'; testDiv.state='scroll'"><span style="font-family: Webdings">4</span>向右</button>

<button onclick="testDiv.direction='down'; testDiv.state='scroll'"><span style="font-family: Webdings">6</span>向下</button>

<br>

缩放:

<select onchange="testDiv.zoom = this.options[selectedIndex].value">

       <option value=1>100%</option>

       <option value=2>200%</option>

       <option value=3>300%</option>

</select>     

托动范围:

<select onchange="testDiv.drag = this.options[selectedIndex].value">

       <option value="both">随意</option>

       <option value="horizontal" selected>横向</option>

       <option value="vertical">纵向</option>

</select>

</td></tr>

</table>

 

0 Comments

Thu

19

Mar

2009

61、桌面图标的排列

61、桌面图标的排列

脚本说明:

第一步:把如下代码加入<body>区域中

<script>

//桌面图标距离与菜单效果

ico_top=10;

ico_left=10;

ico_bottom=30;

ico_x=65;

ico_y=65;

function setico()

{

/*Haiwa@20:45 2002-8-26*/

divCount = document.all.ico.all.tags("DIV");

for (i=0; i<divCount.length; i++) {

obj = divCount(i);

win_y=document.body.clientHeight-ico_top-ico_bottom;//图标的纵坐标范围

n=Math.round(win_y/ico_y);//每列可排列的个数

num=i+1;

if (n!=0){

l=Math.round(num/n+0.49);//图标的列数

numy=i-n*l+n;//在每一列中图标的序数

obj.style.left=l*ico_x-ico_x+ico_left;

obj.style.top=numy*ico_y+ico_top;

}

}

}

</script>

<style>

div{font-size:12px}

.icon{position: absolute; top: -100; left: -100; width: 56; height: 45;font-family:Tahoma;color:#FFFFFF}

</style>

<div id=ico>

<!-- 桌面图标 -->

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">0</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">1</font>

<br>Open Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">2</font>

<br>My Text</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">3</font>

<br>My Word</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">4</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">5</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">6</font>

<br>Waiting</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">7</font>

<br>Typer</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">8</font>

<br>Mouse</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">9</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">)</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">!</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">@</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">#</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">$</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">%</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">^</font>

<br>My Folder</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">&</font>

<br>My Book</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">*</font>

<br>My Mail</p></div>

 

<div id="ico1" class=icon><p align="center">

<font face="Wingdings" style="font-size:32px">(</font>

<br>My Phone</p></div>

 

</div>

<script>setico();</script>

 

 

第二步:把<body>中的内容改为:

<body onresize=setico(); onselectstart="return false" onload="setico();" bgcolor="#336699">

 

0 Comments