JavaScript DHTML/Ajax Layer/HyperLink

Материал из Web эксперт
Перейти к: навигация, поиск

Blink hyperlink

http://dynapi.sourceforge.net/
GNU LESSER GENERAL PUBLIC LICENSE
Version 2.1, February 1999
<html>
<head>
<title>DynAPI Examples - Template Manager</title>
<script language="JavaScript" src="./dynapisrc/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath("./dynapisrc/");
dynapi.library.include("dynapi.api");
dynapi.library.include("TemplateManager");
dynapi.library.include("HTMLCalendar");
dynapi.library.include("HTMLRollover");
dynapi.library.include("HTMLClock");
dynapi.library.include("HTMLMenu");
</script>
<script language="Javascript">
// HTML code/templates
var template1="<table cellSpacing=0 cellPadding=0 width=340 border=0>\n  <tr>\n    <td width=10><img src="./dynapiexamples/images/edge.tplt.gif" border=0 width="10" height="10" /></td>\n    <td width=320 background="./dynapiexamples/images/edge.tp.gif"><img height=10 src="./dynapiexamples/images/pixel.gif" width=1 border=0 /></td>\n    <td width=10><img height=10 src="./dynapiexamples/images/edge.tprt.gif" width="10" border="0" /></td>\n  </tr>\n  <tr>\n      <td width=10 background="./dynapiexamples/images/edge.lt.gif"><img height=1 src="./dynapiexamples/images/pixel.gif" width=10 border=0></td>\n      <td vAlign=top width=320 bgColor=#f5f5f5>\n      <table cellSpacing=0 cellPadding=4 width="100%" border=0>\n      <tr>\n        <td noWrap align=center bgcolor="#FFFFFF" width="100%">\n        <table border="0" style="border-collapse: collapse" bordercolor="#111111" cellpadding="0" cellspacing="0">\n          <tr>\n          <td width="100%">\n          <img border=0 src="./dynapiexamples/images/htmlcomponents.gif" width="285" height="42"></td>\n          </tr>\n          <tr>\n          <td width="100%" bgcolor="003366">\n          {@hmenu}\n          </td>\n          </tr>\n          <tr>\n          <td width="100%">\n          <table border="0" cellpadding="4" style="border-collapse: collapse" bordercolor="#111111" id="AutoNumber1" cellspacing="3">\n            <tr>\n            <td valign="top">\n            <table border="0" cellpadding="2" cellspacing="1" style="border-collapse: collapse" bordercolor="#111111" width="103" id="AutoNumber2">\n              <tr>\n              <td width="93" align="center">{@hbtn1}</td>\n              </tr>\n              <tr>\n              <td width="93" align="center">{@hbtn2}</td>\n              </tr>\n              <tr>\n              <td width="93" align="center"><br>\n                {@hclk}</td>\n              </tr>\n            </table>\n            </td>\n            <td valign="top">{@hcal}</td>\n            </tr>\n          </table>\n          </td>\n          </tr>\n          <tr>\n          <td width="100%" align="right">{@lyr1}</td>\n          </tr>\n          <tr>\n          <td width="100%" align="center" style="border-top: 1px solid #000000" bgcolor="#F5F5F5"><b>\n        <font face="Arial, Helvetica, sans-serif" size="2" color="#800000">DynAPI</font></b><font color=#333333 \n        face="Arial, Helvetica, sans-serif" size=2> |&nbsp; {@hlink}</font></td>\n          </tr>\n        </table>          \n        </td>\n      </tr>\n      </table>\n    </td>\n      <td width=10 background="./dynapiexamples/images/edge.rt.gif"><img height=1 src="./dynapiexamples/images/pixel.gif" width=10 border=0></td>\n  </tr>\n  <tr>\n      <td width=10><img height=10 src="./dynapiexamples/images/edge.bmlt.gif" width=10 border=0></td>\n      <td width=320 background="./dynapiexamples/images/edge.bm.gif"><img height=10 src="./dynapiexamples/images/pixel.gif" width=1 border=0></td>\n      <td width=10><img height=10 src="./dynapiexamples/images/edge.bmrt.gif" width=10 border=0></td>\n    </tr>\n</table>";
var tp = new Template(template1,150,40,400,360);
var imgPath = "./dynapiexamples/images/";;
var btn_home = imgPath+"btn_home_";
var btn_contact = imgPath+"btn_contact_";
var btnE = {
  onclick:function(e){
    alert("Hello from  "+e.getSource()._tmplFld)
  }
};
// HTMLMenu
var mbar;
tp.addChild(new HTMLMenu(),"hmenu");
// Main Menu
mbar= tp.hmenu.createMenuBar("main",40,20);
mbar.addItem(null,"File","file");
mbar.addItem(null,"Edit","edit");
mbar.addItem(null,"View","view");
mbar.addItem(null,"Tools","tools");
mbar.addItem(null,"Help","help");
  //File menu
  mbar = tp.hmenu.createMenuBar("file",130);
  mbar.addItem(null,"New");
  mbar.addItem(null,"Open",null,"alert("Open files")",null,null,"navy","red");
  mbar.addItem(null,"Save");
  mbar.addItem(null,"Save As ...");
  mbar.addItem(null,"Recent Files","recent");
  mbar.addItem(null,"Exit");
    //Recent menu
    mbar = tp.hmenu.createMenuBar("recent",120);
    mbar.addItem(null,"Dynapi.js");
    mbar.addItem(null,"Quickref.html");
    mbar.addItem(null,"Changelog.html");
    mbar.addItem(null,"Index.html");
  //edit menu
  mbar = tp.hmenu.createMenuBar("edit",120);
  mbar.addItem(null,"Undo");
  mbar.addItem(null,"Cut");
  mbar.addItem(null,"Copy");
  mbar.addItem(null,"Paste");
  //view menu
  mbar = tp.hmenu.createMenuBar("view",130);
  mbar.addItem(null,"Go");
  mbar.addItem(null,"Stop");
  mbar.addItem(null,"Toolbars","tbar");
  mbar.addItem(null,"Status Bar");
    // tbar
    mbar = tp.hmenu.createMenuBar("tbar",120);
    mbar.addItem(null,"Header");
    mbar.addItem(null,"Footer");
    mbar.addItem(null,"Standard");
    mbar.addItem(null,"Drawing");
  //tools menu
  mbar = tp.hmenu.createMenuBar("tools",120);
  mbar.addItem(null,"Options");
  mbar.addItem(null,"Macro");
  mbar.addItem(null,"Convert...");
  mbar.addItem(null,"Run...");
//HTMLRollovers
tp.addChild(new HTMLRollover(null,85,29,btn_home+"off.gif",btn_home+"on.gif"),"hbtn1");
tp.addChild(new HTMLRollover(null,85,29,btn_contact+"off.gif",btn_contact+"on.gif"),"hbtn2");
tp.hbtn1.addEventListener(btnE);
tp.hbtn2.addEventListener(btnE);
//HTMLHyperLink
tp.addChild(new HTMLHyperLink(null,"Click Here","http://dynapi.sf.net"),"hlink");
tp.hlink.startFlash("blue","black")
tp.hlink.addEventListener({
  onclick:function(e){
    var o=e.getSource();
    alert("A link to DynAPI"s website")
    // o.allowEvent(); // By default HyperLink events are canceled (return false)
  }
});

//HTMLClock
tp.addChild(new HTMLClock(),"hclk");

// HTML Calender
hc = tp.addChild(new HTMLCalendar(),"hcal");
// modify colors
hc.borCol = "#000000";
hc.titleBgCol ="maroon";
hc.titleFgCol ="white";
hc.wkDayBgCol ="beige";
hc.selBorCol = "#CCCCCC";
hc.selBgCol = "#DEDEFF";
hc.selTDayBgCol = "beige";
hc.addEventListener({
  onchange:function(e){
    var o=e.getSource();
    var l=o.parent.lyr1;
    if(l) {
      var dt = o.getDate();
      dt=(!dt)? "":(dt.getMonth()+1)+"/"+dt.getDate()+"/"+dt.getFullYear();
      o.parent.lyr1.setHTML("<font face="arial" size="2">Date is "+dt+"</font>");
    }
  }
});
//DynLayer
tp.addChild(new DynLayer(null,0,0,200,20),"lyr1");
dynapi.document.addChild(tp);
</script></head>
<body>
<script>
  dynapi.document.insertAllChildren();
</script>
</body>
</html>


<A href="http://www.wbex.ru/Code/JavaScriptDownload/dynapi.zip">dynapi.zip( 791 k)</a>


HyperLink control in JavaScript

http://dynapi.sourceforge.net/
GNU LESSER GENERAL PUBLIC LICENSE
Version 2.1, February 1999
<html>
<head>
<title>DynAPI Examples - HTML HyperLink</title>
<script language="JavaScript" src="./dynapisrc/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath("./dynapisrc/");
dynapi.library.include("dynapi.api");
dynapi.library.include("TemplateManager");
dynapi.library.include("HTMLHyperLink");
dynapi.library.include("FlashSound");
</script>
<script language="Javascript">
fs = new FlashSound();
fs.setSWF("images/sndfx.swf");
HTMLComponent.setFlashSound(fs); // Set FlashSound object for all HCs
var tp = new Template("This is the Template:<center><table border="1"><tr><td>{@fld}</td></tr></table></center>",100,100,250,200,"lime");
hl = new HTMLHyperLink(null,"Click Here",null,"HTML Hyper Link Demo");
hl.sndOnMouseover = "/click@start";
hl.sndOnClick = "/check@start";
hl.startFlash()
hl.addEventListener({
  onclick:function(e){
    var o=e.getSource();
    o.setURL("dynapi.sf.net"); // jump to url;
    status = "Visit DynAPI\"s website at http://"+o.getURL();
    // o.allowEvent(); // By default HyperLink events are canceled (return false)
  }
});
tp.addChild(hl,"fld");
dynapi.document.addChild(tp);
</script>
</head>
<body>
<script>
  dynapi.document.insertAllChildren();
</script>
</body>
</html>


<A href="http://www.wbex.ru/Code/JavaScriptDownload/dynapi.zip">dynapi.zip( 791 k)</a>