小编Sir*_*own的帖子

将div转换为可下载的图像

这是我用来将div转换为图像并使用html2canvas.js下载的代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://html2canvas.hertzen.com/build/html2canvas.js"></script>
<style>
    #download{
        margin:10% 40%;
    }
    .download-btn{
        padding:10px;
        font-size:20px;
        margin:0 20px;
    }
    #test{
        background:#3399cc;
        padding:50px;
    }
    .x2{
        transform: scale(2,2);
    }
</style>


   <div id="download">
      <h1 id="test">Testing Download</h1>
   </div>

    <center>
        <button id="download-window" class="download-btn">New Window</button>
        <button id="download-png" class="download-btn">Download png</button>
        <button id="download-jpg" class="download-btn">Download jpg</button>
        <button id="download-pngx2" class="download-btn">Download pngx2</button>
    </center>


<script>
    $('#download-window').click(function(){

            html2canvas($('#download'), 
             {
                onrendered: function (canvas) {
                    var img = canvas.toDataURL("image/png");
                    window.open(img);
                }
             });
            });

    $('#download-png').click(function(){

            html2canvas($('#download'), 
             {
                onrendered: function (canvas) {
                var a = document.createElement('a');
                    a.href = canvas.toDataURL("image/png");       
                    a.download …
Run Code Online (Sandbox Code Playgroud)

javascript php image css3 html5-canvas

11
推荐指数
2
解决办法
1万
查看次数

如何仅使用css隐藏一个选项元素

 <select class="Select-input">
   <option value="one">One</option>
   <option value="two">Two</option>
   <option value="three">Three</option>
   <option value="four">Four</option>
 </select>
Run Code Online (Sandbox Code Playgroud)

我想只隐藏上面代码中的值四.

我尝试使用{display:none}作为值-4,但它不起作用.

还想在这个元素之间添加填充一,二,三和四.

PS我想只使用CSS删除它.

html css

6
推荐指数
1
解决办法
2万
查看次数

标签 统计

css ×1

css3 ×1

html ×1

html5-canvas ×1

image ×1

javascript ×1

php ×1