我正在完成一项任务,我想在html中创建在线名片。现在,在加载时,它看起来像我画了不同的形状。
根据你看到的第一张图片,我画了不同的形状
在第二张图片中,当我选择一张图片时,塑造的工具包是隐藏的,因此我无法在图像上创建形状。
因此,根据我的代码研究,我意识到jquery“initialize:function()”在选择图片后没有加载。所以可以说在加载时jquery并没有激发。
这是我的代码,
<script type='text/javascript' src='js/jquery.min.js'></script>
<script src="js/kinetic-v3.9.3.js"></script>
<script type="text/javascript" src="js/version1.js"></script>
<link href="css/layout.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="css/menu.css" type="text/css" media="screen" />
<!-- Menu -->
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="css/ie/ie.css" />
<![endif]-->
<link rel="stylesheet" href="styles/global.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/mobile.js"></script>
<script type="text/javascript" src="js/form.js"></script>
<script type="text/javascript" src="./lib/jquery.1.10.2.min.js"></script>
<!-- jquery -->
<script type="text/javascript" src="./Pixanova_files/jquery.min.1.9.0.js"></script>
<!-- backbone -->
<script type="text/javascript" src="./Pixanova_files/underscore.min.1.4.4.js"></script>
<script type="text/javascript" src="./Pixanova_files/backbone.min.0.9.10.js"></script>
<!-- wColorPicker -->
<link rel="stylesheet" type="text/css" href="./Pixanova_files/wColorPicker.css">
<script type="text/javascript" src="./Pixanova_files/wColorPicker.js"></script>
<!-- wPaint -->
<script type="text/javascript" src="./Pixanova_files/jquery.ui.core.min.js"></script>
<script type="text/javascript" src="./Pixanova_files/jquery.ui.widget.min.js"></script>
<script type="text/javascript" src="./Pixanova_files/jquery.ui.mouse.min.js"></script>
<script type="text/javascript" src="./Pixanova_files/jquery.ui.draggable.min.js"></script>
<link rel="stylesheet" type="text/css" href="./Pixanova_files/wPaint.css">
<script type="text/javascript" src="./Pixanova_files/wPaint.js"></script>
<!-- pixanova -->
<script type="text/javascript" src="./Pixanova_files/pixanova.js"></script>
<link rel="stylesheet" type="text/css" href="./Pixanova_files/pixanova.css">
<div id="wrapper">
<!--header-->
<div id="content">
<!-- container is the div id from where the image is display -->
<div id="container" style="width:600px; height:600px; float:right"> </div>
<script type="text/javascript">
var pixanova = new PixanovaView321();
</script>
<div id="editor">
<ul id="text" style="float: left; margin-right:10px;">
<!--<div id="spinner" class="spinner" style="display:none;margin-left:80px;margin-bottom:20px;"> Image Uploading<img src="images/ajax.png" alt="loading">
</div>-->
<div id="container2" style="width:140px;"> </div>
<li>
<label> </label>
<input type="submit" id="textsubmit" value="Add Text"/>
<select name="Choice" onchange="setImage(this);">
<option value="images/blue.jpg">Photo 1</option>
<option value="images/black.jpg">Photo 2</option>
<option value="images/red.jpg">Photo 3</option>
<option value="images/redplan.jpg">Photo 4</option>
</select>
<input type='file' />
</li>
</ul>
<p class="clearing" /></p>
</div>
</div>
</div>
<!--container-->
</body>
这里是工具包调用的外部pixanova.js代码
//这个变量在pixanova.html中调用PixanovaView321函数
var PixanovaView321 = Backbone.View.extend(
{
initialize: function()
{
alert();
//Menu option
$('#container').wPaint({
menuOffsetX: 50,
menuOffsetY: 50,
menuOrientation: 'horizontal',
strokeStyle: "yellow"
});
},
});