Top Questions:

  • 3 years-4 months

    Prevent auto rotation while uploading in php

    • Category : php
    • Location : Chandigarh
    • Posted On :
    • Posted by : Guley

    You can prevent auto image rotation problem using this code

    function correctImageOrientation($filename) {
      if (function_exists('exif_read_data')) {
        $exif = exif_read_data($filename);
        if($exif && isset($exif['Orientation'])) {
          $orientation = $exif['Orientation'];
          if($orientation != 1){
            $img = imagecreatefromjpeg($filename);
            $deg = 0;
            switch ($orientation) {
              case 3:
                $deg = 180;
                break;
              case 6:
                $deg = 270;
                break;
              case 8:
                $deg = 90;
                break;
            }
            if ($deg) {
              $img = imagerotate($img, $deg, 0);        
            }
            // then rewrite the rotated image back to the disk as $filename 
            imagejpeg($img, $filename, 95);
          } // if there is some rotation necessary
        } // if have the exif orientation info
      } // if function exists      
    }
    
    $target_dir = "blog/";
    $target_file = $target_dir . basename($blogimg);
    $imge=correctImageOrientation($target_file);
    move_uploaded_file($_FILES["blogimg"]["tmp_name"], $imge); 
    $query=mysql_query("insert into tablename (`image_name`) values ('$target_file')");
    
  • 3 years-4 months

    Jquery Change css and background

    • Category : jquery
    • Location : Chandigarh
    • Posted On :
    • Posted by : Guley

    You can change background of container using this code

    Html:
    
    <form class="form-inline">
         <div class="form-group">
          <label for="fileToUpload"> <img src="images/upload.png'; ?> " width="200" height="100" id="blah1" /></label>
           <div class="input-group">
      <input type="file" name="exmaple" id="fileToUpload"  required>
      <input type="hidden" id="backupimgurl" val="">
     </div>
      </div>
            <div class="form-group">
        <div class="input-group">
     <select class="form-control" onchange="$('#home-page').css({'background-position':$(this).val()});" name="BackgroundPosition" id="BackgroundPosition">
        <option value="center" selected="selected">Center</option>
        <option value="center top">Center/Top</option>
        <option value="center bottom">Center/Bottom</option>
        <option value="left center">Left/Center</option>
        <option value="left top">Left/Top</option>
        <option value="left bottom">Left/Bottom</option>
        <option value="right center">Right/Center</option>
        <option value="right top">Right/Top</option>
        <option value="right bottom">Right/Bottom</option>
      </select>
     </div>
     </div>
     <div class="form-group">
      <div class="input-group">
      <select class="form-control" onchange="$('#home-page').css({'background-repeat':$(this).val()});" name="BackgroundImageRepeat" id="BackgroundImageRepeat">
       <option value="repeat-x">Repeat Horizontal</option>
       <option value="repeat-y">Repeat Vertical</option>
       <option value="repeat">Repeat</option>
        <option value="no-repeat" selected="selected">No Repeating</option>
          </select>
      </div>
    </div>
    <div class="form-group">
      <div class="input-group">
       <input class="form-control" value="" name="BackgroundColor" style="width:80%; display:inline-block;" maxlength="6" placeholder="color">
     </div>
      </div>
     <div class="form-group">
     <div class="input-group">
         <button type="submit" class="btn btn-success">Save</button>
         </div>
          <div class="input-group">
         <button type="submit" class="btn btn-danger">Cancel</button>
        </div>
       </div>
    </form>
    
    jQuery:
    
    jQuery(document).on('change','#fileToUpload',function(){
     var imgbg = window.URL.createObjectURL(this.files[0]);
      jQuery('#backupimgurl').val(imgbg);
       //console.log(imgbg);
     jQuery('#home-page').css({backgroundImage: "url(" imgbg ")"});
    });
    
  • 3 years-4 months

    Prevent page reload after content changed

    • Category : jquery
    • Location : Chandigarh
    • Posted On :
    • Posted by : Guley

    you can prevent your page if some changes has been done on page.and show warning to user if they won't to leave page

    function enableBeforeUnload() {
        window.onbeforeunload = function (e) {
            return "Discard changes?";
        };
    }
    function disableBeforeUnload() {
        window.onbeforeunload = null;
    }
    $('input, textarea, select').change(function(event){
      enableBeforeUnload();
    });
    /***Using Jquery**/
    $('#formid').submit(function(){
     disableBeforeUnload();
    });
    /***useing html**/
    <form action="" onsubmit="disableBeforeUnload();" method="post>
    //your code
    </form>
  • 3 years-4 months

    Display Multiple Images Preview

    • Category : jquery
    • Location : Chandigarh
    • Posted On :
    • Posted by : Guley

    When you select multiple images using file input..after taht display all images where you wan't before upload

    <input type='file' name="image" onchange="preview(this);" multiple="multiple" />
    <div id='previewImg'></div>
    
    <script>
    window.preview = function (input) {
        if (input.files && input.files[0]) {
            $(input.files).each(function () {
                var reader = new FileReader();
                reader.readAsDataURL(this);
                reader.onload = function (e) {
                    $("#previewImg").append("<img class='thumb' src='"   e.target.result   "'>");
                }
            });
        }
    }
    </script>
     
  • 3 years-4 months

    Drag Drop multiple divs

    • Category : php
    • Location : Chandigarh
    • Posted On :
    • Posted by : Guley

    you can drag drop all data between multiple divs

     <div id="1" dvSource dvSourceul">
    <ul id="dropul_1">
          <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" /> </li>
    </ul>
        </div>
    <div id="2">
    <ul id="dropul_2">
          <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" />
    <li class="drop"> <img alt="" src="images/Chrysanthemum.jpg" /> </li>
    </ul>
        </div>
    /********Jquery*********
    <script>
     $(function () {
                $("li.drop").draggable({
                    revert: "invalid",
                    refreshPositions: true,
                    drag: function (event, ui) {
                        ui.helper.addClass("draggable");
                       
                    },
                    stop: function (event, ui) {
                        if ($.ui.ddmanager.drop(ui.helper.data("draggable"), event)) {
                             ui.helper.removeClass("ui-draggable-dragging");
                             ui.helper.removeClass("draggable");
                        }
                        else {
                            //alert(" not dropped.");
                        }
                    }
                });
                $(".dvSourceul").droppable({
                    drop: function (event, ui ) {
                      var newId=event.target.id;
                      var aworkid=ui.draggable.attr('data-id');
                        ui.draggable.addClass("dropped");
                        $("#dropul_" newId).append(ui.draggable);
                        $.ajax({
                          type: "POST",
                          url: "update_work.php",
                          data:'id=' aworkid '&wrkid=' newId,
                          success: function(data){
                          // alert(data);
                          }
                          });
                    }
                });
            });
    
    </script>
  • 3 years-4 months

    Image Compress

    • Category : php
    • Location : Chandigarh
    • Posted On :
    • Posted by : Guley

    COmpress your image size using php

    <?php
     $name = ''; $type = ''; $size = ''; $error = '';
      function compress_image($source_url, $destination_url, $quality) {
    
        $info = getimagesize($source_url);
    
            if ($info['mime'] == 'image/jpeg')
                  $image = imagecreatefromjpeg($source_url);
    
            elseif ($info['mime'] == 'image/gif')
                 $image = imagecreatefromgif($source_url);
    
           elseif ($info['mime'] == 'image/png')
                 $image = imagecreatefrompng($source_url);
    
           imagejpeg($image, $destination_url, $quality);
        return $destination_url;
      }
    
     if ($_POST) {
    
           if ($_FILES["file"]["error"] > 0) {
                  $error = $_FILES["file"]["error"];
            } 
            else if (($_FILES["file"]["type"] == "image/gif") || 
         ($_FILES["file"]["type"] == "image/jpeg") || 
         ($_FILES["file"]["type"] == "image/png") || 
          ($_FILES["file"]["type"] == "image/pjpeg")) {
    
                 $url = 'destination .jpg';
    
                  $filename = compress_image($_FILES["file"]["tmp_name"], $url, 80);
                  $buffer = file_get_contents($url);
    
                  /* Force download dialog... */
                  header("Content-Type: application/force-download");
                 header("Content-Type: application/octet-stream");
                 header("Content-Type: application/download");
    
         /* Don't allow caching... */
                 header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
    
                  /* Set data type, size and filename */
                  header("Content-Type: application/octet-stream");
                 header("Content-Transfer-Encoding: binary");
                  header("Content-Length: " . strlen($buffer));
                 header("Content-Disposition: attachment; filename=$url");
    
                 /* Send our file... */
                  echo $buffer;
           }else {
                 $error = "Uploaded image should be jpg or gif or png";
            }
     }
    ?>
    <html>
          <head>
                <title>Php code compress the image</title>
          </head>
         <body>
    
        <div class="message">
                         <?php
                            if($_POST){
                               if ($error) {
                                   ?>
                                   <label class="error"><?php echo $error; ?></label>
                            <?php
                                    }
                             }
                         ?>
                     </div>
        <fieldset class="well">
                       <legend>Upload Image:</legend>                
          <form action="" name="myform" id="myform" method="post" enctype="multipart/form-data">
            <ul>
                        <li>
                <label>Upload:</label>
                                          <input type="file" name="file" id="file"/>
              </li>
             <li>
                <input type="submit" name="submit" id="submit" class="submit btn-success"/>
             </li>
           </ul>
         </form>
       </fieldset>
     </body>
    </html>
     
  • 5 years-11 months

    How to Manipulating or Modify the Browser History in Complex HTML5 and JavaScript Applications

    • Category : java
    • Location : Chandigarh, India
    • Posted On :
    • Posted by : Vikas

    URL — The new history entry's URL is given by this parameter. Note that the browser won't attempt to load this URL after a call to pushState(), but it might attempt to load the URL later, for instance after the user restarts the browser. The new URL does not need to be absolute; if it's relative, it's resolved relative to the current URL. The new URL must be of the same origin as the current URL; otherwise, pushState() will throw an exception. This parameter is optional; if it isn't specified, it's set to the document's current URL.

    // modify history
    window.history.pushState(obj, title, url);
    window.history.pushState("", "", 'www.dorcode.com');  
  • 5 years-11 months

    How to compress CSS files using PHP

    • Category : php
    • Location : Chandigarh, India
    • Posted On :
    • Posted by : Vikas

    When you’re using a sophisticated design, CSS files can quickly become very long, and takes time to load. I have compiled interresting ways of compressing CSS files by using PHP.

    (1.)
    <link rel="stylesheet" type="text/css" media="screen" href="/style.css.php"/>
    Once you successfully rename your css files, edit it and add the following code at the beginning of the file:
    <?php if(extension_loaded('zlib')){ob_start('ob_gzhandler');} header("Content-type: text/css"); ?>
     

    2 Answers

    View More

    vikas image

    Name: vikas

    Experiance: 5 years-11 months

    answered
    Jul 01, 2016 at 07:11

    Then, add the next line to the very bottom and save the file.
    <?php if(extension_loaded('zlib')){ob_end_flush();}?>
     
  • 5 years-11 months

    UI Datepicker be made to disable Saturdays and Sundays with custom date

    • Category : jquery
    • Location : Chandigarh, India
    • Posted On :
    • Posted by : Vikas

    I use a datepicker for choosing an appointment day.I want to exclude Saturdays and Sundays from the available choices. Can this be done? If so, how?

    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <input name="datenew" type="text" id="datepicker">
    <script>
    var unavailableDates = ["21-6-2016","22-6-2016","23-6-2016","24-6-2016"];
    function unavailable(date) {
      var day = date.getDay(), Sunday = 0, Monday = 1, Tuesday = 2, Wednesday = 3, Thursday = 4, Friday = 5, Saturday = 6;
        dmy = date.getDate()   "-"   (date.getMonth()   1)   "-"   date.getFullYear();
      var closedDays = [[Saturday],[Sunday]];
     for (var i = 0; i < closedDays.length; i  ) {
        if (day == closedDays[i][0]) {
          return [false];
       }
    
     }
        if (jQuery.inArray(dmy, unavailableDates) == -1) {
            return [true, ""];
        } else {
            return [false, "", "Unavailable"];
        }
    }
    jQuery(function() {
      jQuery( "#datepicker" ).datepicker({    
        changeMonth: true,
        changeYear: true,
       dateFormat: 'dd MM yy',   
        autoclose: true,
        minDate:  2,
        firstDay: 1,
        beforeShowDay: unavailable
      });
    
    });
    </script>
  • 5 years-11 months

    how bootstrap modal rotate and show

    • Category : css
    • Location : Chandigarh, India
    • Posted On :
    • Posted by : Vikas

    this css class add your bootstrap modal then see the magic

    rotate {
        transform:rotate(180deg);
        transition:all 0.5s;
    }
    .rotate.in {
        transform:rotate(1800deg);
        transition:all 1.5s;
    }