File: html/jasper_ej.html

Recommend this page to a friend!
  Classes of José M. Carnero   JaSper   html/jasper_ej.html   Download  
File: html/jasper_ej.html
Role: Auxiliary data
Content type: text/plain
Description: JaSper example
Class: JaSper
JavaScript framework for Web manipulation
Author: By
Last change:
Date: 9 years ago
Size: 2,580 bytes
 

Contents

Class file image Download
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>test js framework</title> <script type="text/javascript" src="../JaSper.js"></script> <script type="text/javascript"> <!-- //window.onload = function(){alert(jsframe.prototype.toString());} $().ready(function(){ $(".formb * li").eventAdd("mouseenter", function (){ this.style.backgroundColor = "red";}).eventAdd("mouseleave", function (){this.style.backgroundColor = "yellow"; }); $('.mueveme').move(); $('<input>') .eventAdd('click', function (){ alert(this.value?this.value:'valor desconocido');}) .eventAdd('mouseup', function (ev){ document.getElementById('destino').innerHTML = JaSper.funcs.eventTarget(ev);}); $('<body>') .eventAdd('mousemove', function (ev){ document.getElementById('destino').innerHTML = JaSper.funcs.eventTarget(ev);}); }); --> </script> </head> <body> <h1>test js framework</h1> <p>origen: <span id="origen"></span><br />destino: <span id="destino"></span><br />evento: <span id="evento"></span></p> <div> <span class="mueveme" style="left:20px;width:60px;height:20px;z-index:5;cursor:pointer;background-color:green;">mueveme</span> <span class="mueveme" style="left:200px;width:60px;height:20px;z-index:5;cursor:pointer;background-color:maroon;">mueveme</span> </div> <br /><form action="#" method="post" class="formb"> <ul> <li><label for="campo1">etiqueta input text </label><input id="campo1" name="campo1" type="text" value="valor input text" /></li> <li><label for="campo2">etiqueta textarea </label><textarea id="campo2" name="campo2">valor campo1</textarea></li> <li><label for="select">etiqueta select </label><select id="select" name="select"> <option value="opciĆ³n 1">opciĆ³n 1</option> <option value="opciĆ³n 2">opciĆ³n 2</option> <option value="opciĆ³n 3">opciĆ³n 3</option> <option value="opciĆ³n 4">opciĆ³n 4</option> <option value="opciĆ³n 5">opciĆ³n 5</option> </select> </li> <li>radio buttons <ul> <li><label for="radio1">etiqueta radio1 </label><input id="radio1" name="radio" value="valor radio1" /></li> <li><label for="radio2">etiqueta radio2 </label><input id="radio2" name="radio" value="valor radio2" /></li> <li><label for="radio3">etiqueta radio3 </label><input id="radio3" name="radio" value="valor radio3" /></li> </ul> </li> <li><input id="butsubmit" name="butsubmit" type="submit" value="botĆ³n de enviar" /></li> </ul> </form> </body> </html>