Why is this jquery image watermarking plugin not working? I am using the code from the official plugin website.. from here When i see the source code of the demo website they have used js/jquery-watermarker-0.3.js. but i cannot find this plugin online anywhere? how come this works for them in the demo. Please help.
<html>
<head>
<script type="text/javascript" src="js/jquery.js">
<script type="text/javascript" src="js/jquery-1.4.2.min.js">
<script type="text/javascript" src="js/jquery-ui-1.8.6.custom.min.js">
<script type="text/javascript" src="js/jquery-watermarker-0.2.js">
<script type="text/javascript">
$().ready(function(){
$('#watermarked').Watermarker({
watermark_img: "a.png",
onChange: showCoords
});
});
function showCoords(c)
{
$('#x').val(c.x);
$('#y').val(c.y);
$('#w').val(c.w);
$('#h').val(c.h);
};
</script>
<style type="text/css">
div.watermark
{
border:1px dashed #000;
}
img.watermark:hover{
cursor:move;
}
</style>
</head>
<body>
<img src="1.jpg" id="watermarked" />
<form method="post" action="phpScriptToMergeBothImage.php">
<input type="text" id="x" name="x" value="" />
<input type="text" id="y" name="y" value="" />
<input type="text" id="w" name="w" value="" />
<input type="text" id="h" name="h" value="" />
<input type="submit" name="save" value="Ok >" />
</form>
</body>
</html>
Make sure you’ve downloaded the plugin from the site (here) and included the scripts in your file. In the code you supplied above, it looks like you should have a folder called ‘js’ that contains ‘jquery.js’, ‘jquery-1.4.2.min.js’, ‘jquery-ui-1.8.6.custom.min.js’ and ‘jquery-watermarker-0.2.js’. If this is true, the plug-in is loaded.
Next, make sure that you also have the images ‘1.jpg’ and ‘a.png’ in your root folder, where ‘1.jpg’ is the background image and ‘a.png’ is the image you want the watermark to be. If they don’t have those names, change the names in the plug-in code to match the name of the images that you’re working with.