使用Chrome播放本地SWF文件

两个版本, 一个是选择文件, 一个是直接拖拽。当然也有合并到一起的办法, 参考这里。直接将下列文件放到和flash同一目录然后用浏览器打开并将swf上传或者拖拽到改网页即可。

点击上传版

<!DOCTYPE>
<html>
  <head>
    <title>SWF player</title>
  </head>
  <style>
#container{
  display: flex;
  min-height:100%;
  flex-direction:column;
  align-items:stretch;
}
#file {
  padding-bottom: 1em;
  border-bottom: double 6px #ccc;
  margin-bottom: 1em;
}
#file input {
  font-size: 30px;
}
  </style>
  <body>
    <div id="container">
      <div id="file">
        <input type="file" id="swfinput" onchange="showSWF(this.files);">
      </div>
      <div class="swf">
        <object>
          <embed  id="swfobj" src="" width="100%">
        </object>
      </div>
    </div>
  </body>
  <script>
function showSWF(files){
  var numFiles=files.length;
  for (var i=0; i<numFiles; i++){
    var file=files[i];
    //console.log(file.name, file.size, file.type);
    var source=file.name;
    var swfobj=document.getElementById("swfobj");
    var inputh=document.getElementById("file").offsetHeight;
    var containerh=document.getElementById("container").offsetHeight;
    var swfh=containerh-inputh;
    var clone=swfobj.cloneNode(true);
    clone.setAttribute('src', source);
    clone.setAttribute('height', swfh);
    swfobj.parentNode.replaceChild(clone, swfobj);
    //console.log(swfh, containerh);
  }
}
  </script>
</html>

<!DOCTYPE>

<html>

<head>

<title>SWF player</title>

</head>

<style>

#container{

display: flex;

min-height:100%;

flex-direction:column;

align-items:stretch;

}

#file {

padding-bottom: 1em;

border-bottom: double 6px #ccc;

margin-bottom: 1em;

}

#file input {

font-size: 30px;

}

</style>

<body>

</div>

</object>

</div>

</body>

function showSWF(files){

var numFiles=files.length;

for (var i=0; i<numFiles; i++){

var file=files[i];

//console.log(file.name, file.size, file.type);

var source=file.name;

var swfobj=document.getElementById("swfobj");

var inputh=document.getElementById("file").offsetHeight;

var containerh=document.getElementById("container").offsetHeight;

var swfh=containerh-inputh;

var clone=swfobj.cloneNode(true);

clone.setAttribute('src', source);

clone.setAttribute('height', swfh);

swfobj.parentNode.replaceChild(clone, swfobj);

//console.log(swfh, containerh);

}

</script>

</html>

拖拽版

<!DOCTYPE>
<html>
  <head>
    <title>SWF player</title>
  </head>
  <style>
#container{
  display: flex;
  min-height:100%;
  flex-direction:column;
  align-items:stretch;
}
#file {
  padding-bottom: 1em;
  border-bottom: double 6px #ccc;
  margin-bottom: 1em;
  height:45px;
  text-align: center;
  line-height: 45px;
  background: #eef;
  border: dashed 3px #eec;
}
#file input {
  font-size: 30px;
}
  </style>
  <body>
    <div id="container">
      <div id="file">
        Drag file to here...
      </div>
      <div class="swf">
        <object>
          <embed  id="swfobj" src="" width="100%">
        </object>
      </div>
    </div>
  </body>
  <script>
var dropbox;

dropbox = document.getElementById("file");
dropbox.addEventListener("dragenter", dragenter, false);
dropbox.addEventListener("dragover", dragover, false);
dropbox.addEventListener("drop", showSWF, false);
function dragenter(e){
  e.stopPropagation();
  e.preventDefault();
}
function dragover(e){
  e.stopPropagation();
  e.preventDefault();
}

function showSWF(e){
  e.stopPropagation();
  e.preventDefault();

  var dt=e.dataTransfer;
  var files=dt.files;
  var numFiles=files.length;
  for (var i=0; i<numFiles; i++){
    var file=files[i];
    console.log(file.name, file.size, file.type);
    var source=file.name;
    var swfobj=document.getElementById("swfobj");
    var inputh=document.getElementById("file").offsetHeight;
    var containerh=document.getElementById("container").offsetHeight;
    var swfh=containerh-inputh;
    var clone=swfobj.cloneNode(true);
    clone.setAttribute('src', source);
    clone.setAttribute('height', swfh);
    swfobj.parentNode.replaceChild(clone, swfobj);
    //console.log(swfh, containerh);
  }
}
  </script>
</html>

<!DOCTYPE>

<html>

<head>

<title>SWF player</title>

</head>

<style>

#container{

display: flex;

min-height:100%;

flex-direction:column;

align-items:stretch;

}

#file {

padding-bottom: 1em;

border-bottom: double 6px #ccc;

margin-bottom: 1em;

height:45px;

text-align: center;

line-height: 45px;

background: #eef;

border: dashed 3px #eec;

}

#file input {

font-size: 30px;

}

</style>

<body>

Drag file to here...

</div>

</object>

</div>

</body>

var dropbox;

dropbox = document.getElementById("file");

dropbox.addEventListener("dragenter", dragenter, false);

dropbox.addEventListener("dragover", dragover, false);

dropbox.addEventListener("drop", showSWF, false);

function dragenter(e){

e.stopPropagation();

e.preventDefault();

}

function dragover(e){

e.stopPropagation();

e.preventDefault();

}

function showSWF(e){

e.stopPropagation();

e.preventDefault();

var dt=e.dataTransfer;

var files=dt.files;

var numFiles=files.length;

for (var i=0; i<numFiles; i++){

var file=files[i];

console.log(file.name, file.size, file.type);

var source=file.name;

var swfobj=document.getElementById("swfobj");

var inputh=document.getElementById("file").offsetHeight;

var containerh=document.getElementById("container").offsetHeight;

var swfh=containerh-inputh;

var clone=swfobj.cloneNode(true);

clone.setAttribute('src', source);

clone.setAttribute('height', swfh);

swfobj.parentNode.replaceChild(clone, swfobj);

//console.log(swfh, containerh);

}

</script>

</html>

本作品采用创作共用版权协议, 要求署名、非商业用途和保持一致. 转载本站内容必须也遵循署名-非商业用途-保持一致的创作共用协议.

一	二	三	四	五	六	日
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31

使用Chrome播放本地SWF文件

点击上传版

拖拽版

相关文章

WordPress本地安装

发表回复 取消回复

发表回复取消回复