Here is a small code segment which give me highest programmability in svg,
This need jquery and its svg plugin , It will work in firefox
Please comment on it,, how can i make it better, and cross browser.
-------------------------------
you need these files
jquery.js , jquery.svg.js , jquery.svg.css
--------------------------------------------------------
most surprisable thing about the code, --
I am calling external function directly and I am using jquery object
$('#mycircle') where id belong to svg element,
This small code give me very surprise ,, and it is working,,
-----------------------------------------------------------------------
<html>
<head >
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="svg/jquery.svg.js"></script>
<style type="text/css">
@import "svg/jquery.svg.css";
.canvas1
{
position: relative;
height: 400px;
width: 600px;
background: #ffffcc;
border: #ff0000;
}
</style>
<script type="text/javascript">
var start_drag = null ;
var offsetx =null ;
var offsety =null ;
$(document).ready(function() {
$('#svgintro').svg({onLoad: drawIntro});
});
function now_drag(evt){
if (start_drag==1){
$('#mycircle').attr('cx').baseVal.value = evt.layerX - offsetx;
$('#mycircle').attr('cy').baseVal.value = evt.layerY - offsety;
}
}
function start_dragging(evt){
start_drag = 1;
offsetx = evt.layerX - $('#mycircle').attr('cx').baseVal.value ;
offsety = evt.layerY - $('#mycircle').attr('cy').baseVal.value ;
}
function stop_dragging(evt){
start_drag = 0;
}
function drawIntro() {
var svg = $('#svgintro').svg('get');
svg.describe("Example script01 - invoke an ECMAScript function from an
onclick event");
svg.circle(300, 150, 50, {
onmousedown:"start_dragging(evt)",
onmouseup:"stop_dragging(evt)",
onmousemove:"now_drag(evt)",
id:"mycircle",
fill:"red"});
svg.text(300, 280, "Drag It",
{'font-family':"Verdana",
'font-size':20,
'text-anchor':"middle"
});
}
</script >
</head >
<body >
<div id="remove">this line of text is useless like my friends</div>
<div class="canvas1" id="svgintro" ></div>
</body>
</html>
--
[ Narendra Sisodiya ]
http://narendra.techfandu.org
http://www.lug-iitd.org
[ +91-93790-75930 ]
[Non-text portions of this message have been removed]
------------------------------------
-----
To unsubscribe send a message to: [EMAIL PROTECTED]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my
membership"
----Yahoo! Groups Links
<*> To visit your group on the web, go to:
http://groups.yahoo.com/group/svg-developers/
<*> Your email settings:
Individual Email | Traditional
<*> To change settings online go to:
http://groups.yahoo.com/group/svg-developers/join
(Yahoo! ID required)
<*> To change settings via email:
mailto:[EMAIL PROTECTED]
mailto:[EMAIL PROTECTED]
<*> To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
