Keresés

Új hozzászólás Aktív témák

  • bucihost

    senior tag

    válasz sztanozs #6276 üzenetére

    Elképzelhető... sőt...

    Ez a php-ban a megjelenítő rész.
    <div class="wrap">
    <img id="uploadPreview" style="display:none; width: 100%; height: auto;"/>


    <form action="profilkepfel.php" method="post" enctype="multipart/form-data">
    <input id="uploadImage" type="file" accept="image/jpeg" name="image" />
    <input type="submit" value="Feltölt / Mentés">


    <input type="hidden" id="x" name="x" />
    <input type="hidden" id="y" name="y" />
    <input type="hidden" id="w" name="w" />
    <input type="hidden" id="h" name="h" />
    </form>

    </div>

    Ez pedig a JS:
    // set info for cropping image using hidden fields
    function setInfo(i, e) {
    $('#x').val(e.x1);
    $('#y').val(e.y1);
    $('#w').val(e.width);
    $('#h').val(e.height);
    }

    $(document).ready(function() {
    var p = $("#uploadPreview");

    // prepare instant preview
    $("#uploadImage").change(function(){
    // fadeOut or hide preview
    p.fadeOut();

    // prepare HTML5 FileReader
    var oFReader = new FileReader();
    oFReader.readAsDataURL(document.getElementById("uploadImage").files[0]);

    oFReader.onload = function (oFREvent) {
    p.attr('src', oFREvent.target.result).fadeIn();
    };
    });

    // implement imgAreaSelect plug in (http://odyniec.net/projects/imgareaselect/)
    $('img#uploadPreview').imgAreaSelect({
    // set crop ratio (optional)
    aspectRatio: '1:1',
    onSelectEnd: setInfo
    });
    });

    a darabolást ugye az x, y, w, h -ból veszi, de az miért nem változik ha más a megjelenített kép mérete? :O

Új hozzászólás Aktív témák

Hirdetés