สอบถามวิธีการใช้ Jquery picturecrop

สำหรับผู้ที่ เริ่มต้น Programming - PHP มีอะไร แนะนำ หรือข้อสงสัยต้องบอร์ด นี้ คนที่มีความรู้ แบ่งปันคนอื่นบ้างนะ ปัญหาการเขียนโปรแกรม แบบ OOP Session Cookies php network

Moderator: mindphp, ผู้ดูแลกระดาน

offing
PHP VIP Members
PHP VIP Members
โพสต์: 1527
ลงทะเบียนเมื่อ: 18/08/2014 10:01 am

สอบถามวิธีการใช้ Jquery picturecrop

โพสต์ที่ยังไม่ได้อ่าน โดย offing »

สอบถามวิธีการใช้ Jquery picturecrop
ตามลิ้งค์นี้คับ http://picturecut.tuyoshi.com.br/docs/#credits

เปิด GD extension
ตอนนี้โหลดมาแล้วไปวางใน htdocs
โหลดjQuery UI,BootStrap,jquery-min แล้ว
แล้วก็สร้าง ไฟล์ html วางในโฟลเดิ้ลที่โหลดมา่
วางโค็ดตามนี้

โค้ด: เลือกทั้งหมด

<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>crop-crop</title>
        <link rel="stylesheet" href="dependencies/bootstrap-3.2.0/css/bootstrap.min.css"> <!--for bootstrap theme-->    
 
              <script src="dependencies/jquery/jquery-1.11.1.min.js"></script>        
              <script src="dependencies/bootstrap-3.2.0/js/bootstrap.min.js"></script><!--for bootstrap theme-->    
              <script src="dependencies/jquery-ui-1.11.2/jquery-ui.min.js"></script>
              <script src="jquery.picture.cut/src/jquery.picture.cut.js"></script> 
<!--              <style type="text/css">

$("#container_image").PictureCut({
                  InputOfImageDirectory       : "image",
                  PluginFolderOnServer        : "/jquery.picture.cut/",
                  FolderOnServer              : "/uploads/",
                  EnableCrop                  : true,
                  CropWindowStyle             : "Bootstrap"
              });


</style>-->
<script type="text/javascript"> 
    $("#container_image").PictureCut({
                  InputOfImageDirectory       : "image",
                  PluginFolderOnServer        : "/jquery.picture.cut/",
                  FolderOnServer              : "/uploads/",
                  EnableCrop                  : true,
                  CropWindowStyle             : "Bootstrap"
              });
</script> 
    </head>
    <body>
        <div id="container_image">
            <div class="col-lg-8">
<h4>Choose a image or drag from explorer</h4>
<div id="container_photo" class="picture-element-principal" style="border: 1px solid rgb(204, 204, 204); width: 170px; height: 150px; position: relative; cursor: pointer; overflow: hidden;">
<img class="picture-element-image" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" style="position: relative; cursor: pointer; height: 150px;">
<input id="image" class="picture-element-image-directory" type="hidden" name="image">
<form action="/jquery.picture.cut/src/php/upload.php" enctype="multipart/form-data" method="POST">
<input type="file" accept="image/*" name="file-image" style="display: block; position: absolute; left: 0px; top: 0px; width: 168px; height: 148px; font-size: 100pt; opacity: 0; z-index: 10; overflow: hidden;" title="Choose a picture">
</form>
</div>
</div>
        </div>       
        <?php
        // put your code here
        ?>
    </body>
</html>
ยังใช้ไม่ได้ ยังขาดอะไรอยู่คับ
  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

สมาชิกกำลังดูบอร์ดนี้: ไม่มีสมาชิกใหม่ และบุคลทั่วไป 10