小编pix*_*lex的帖子

我正在尝试使用drawImage在canvas元素上绘制一个半透明的PNG.但是,它将图像绘制为完全不透明.当我查看正在加载的资源并在浏览器中加载实际的PNG时,它会显示透明度,但是当我在画布上绘制时,它不会.有任何想法吗？

这是代码:

drawing = new Image() 
drawing.src = "draw.png" 
context.drawImage(drawing,0,0);

我使用@font-face(来自FontSquirrel的css)在移动网站上嵌入字体.当我在桌面Safari或Chrome中预览时,字体嵌入很好,但它们不会出现在iPhone/iPad上的移动Safari中.我没有得到任何错误,我无法弄清楚出了什么问题.这是我的CSS.有任何想法吗？

@font-face {
    font-family: 'JottingRegular';
    src: url('../fonts/jotting_regular-webfont.eot');
    src: local('?'),
         url('../fonts/jotting_regular-webfont.woff') format('woff'),
         url('../fonts/jotting_regular-webfont.ttf') format('truetype'),
         url('../fonts/jotting_regular-webfont.svg#webfonttEfFltbI') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'JottingBold';
    src: url('../fonts/jotting_bold-webfont.eot');
    src: local('?'),
         url('../fonts/jotting_bold-webfont.woff') format('woff'), 
         url('../fonts/jotting_bold-webfont.ttf') format('truetype'), 
         url('../fonts/jotting_bold-webfont.svg#webfontJpUFTHYS') format('svg');
    font-weight: normal;
    font-style: normal;
}

我正在使用画布创建绘图应用程序.如果显示包含canvas元素的div,它可以正常工作.但是,我想最初隐藏包含div,然后使用jquery转换"启动"绘图应用程序以淡入绘图界面.所以包含div最初将其css'display'属性设置为'none',然后我显示它.但是,当我这样做时,canvas元素将不再接收任何绘图输入.我尝试在我的脚本渲染canvas元素之后动态设置display:none,以确保那里没有干扰,但没有骰子.有什么建议？

这是绘图界面的html结构:

<!--DRAWING INTERFACE-->
    <style>
       #draw-container {
         display:none;
         width:1920px;
         height:1080px;
         position:absolute;
         top:0px;
         left:0px;
       }
     </style>
<div id="draw-container">
    <h1>Send a Drawing</h1>
    <div id="draw" class="panel">
    </div>
    <div id="draw-buttons">
        <a id="sendButton" href="#" class="round">></a>
        <a id="clearButton" href="#" class="round">+</a>
    </div>
</div>

然后调用此函数,它将canvas元素创建为"draw"div的子元素:

//creating canvasses
function drawCanvas(id,xOffset){
    //draw
    var canvas = document.createElement("canvas");
    canvas.width = canvasWidth;
    canvas.height = canvasHeight;
    canvas.id = id;
    $('#draw').append(canvas);
}

当用户点击按钮以显示绘图模块时:

document.getElementById('drawLaunch').addEventListener("click", function(){
    $('#draw-container').show();
});

最后,这是绘图功能:

function _drawCircle(mouseX, mouseY) {
//get position
var x = mouseX - offsetLeft,
    y = mouseY - offsetTop; …

我正在编写一个开始div标记,然后使用$.each迭代一些JSON对象并将它们写入div.在$.each函数之后,我正在编写结束div标记.但是,在函数div内的东西$.each执行之前,结束标记被写入,我无法弄清楚原因.这是我的代码:

$("#articles").append("<div id='stories'>");

$.each(articles, function(i, val) {
    $("#articles").append("<div class='story'><h1><a href='"+val.url+"'>"+val.title+"</a></h1><div class='dateline'>"+date+"</div><div class='summary'>"+body+"</div></div>");
});

$("#articles").append("</div>");