Posts

Default Natural Sorting DataTable using script

-
 $('#dataTable').dataTable({             aoColumnDefs: [ {                   bSortable: false,                   sType: "numeric",                   aTargets: [0], // cell target                   mRender: function (data, type, full) {                            if (type === "sort") {                               var regX = /(<([^>]+)>)/ig;                               data = data.replace(regX, "");                               data = data.replace(/\//g, '');     ...
Post a Comment
Read more

Drag and Drop Sortable List using jQuery

-
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>     <style>         body {             font-family: 'Poppins', sans-serif;             padding: 20px;             background: linear-gradient(to right, #6a11cb, #2575fc);             color: #fff;             text-align: center;         }         h2 {             margin-bottom: 20px;             font-size: 1.8em;         }         .sortable-list {             list-style: none;             padding: 0;             width: 350px;         ...
Post a Comment
Read more

Get Youtube Video Id using jQuery

-
 <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"> </script> </head> <body> <textarea ></textarea> <a id="getvideo" href="javascript:void(0)">get Video id </a> <br> get youtube video id using jquery  <br> https://www.youtube.com/watch?v=XXXXXXXXXX <br> https://youtu.be/XXXXXXXXXX?si=hfkQ9K4sKRP9YLKd  <br>   https://www.youtube.com/embed/XXXXXXXXXX?si=hfkQ9K4sKRP9YLKd    <br>       <script> $(document).ready(function(){ $('#getvideo').click(function(){ var videoId = null; var url = $('textarea').val(); var fullUrlPattern = /(?:youtube\.com\/.*[?&]v=|youtu\.be\/|youtube\.com\/embed\/)([^&?]+)/;     var match = url.match(fullUrlPattern); if (match && match[1]) { videoId = match[1]; } alert('<iframe src="https://www.youtube....
Post a Comment
Read more

HTML to JPG/PNG Image format convervter

-
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.js"></script> <script src="http://html2canvas.hertzen.com/dist/html2canvas.min.js"></script> </head> <body> <div id="html-content-holder" style="background-color: #cdb8ff; color: #000; width: 500px;         padding: 25px;">         <strong>Codepedia.info</strong><hr/>         <h3> Html to canvas, and canvas to proper image </h3>         <p>सोSस्य दोषो न मन्तव्यः क्षमा हि परमं बलं | क्षमा गुणो अशक्तानां शक्तानां भूषणं क्षमा ||</p>         <p>             <b>html2canvas</b> script allows you to take "screenshots" of webpages or parts       ...
Post a Comment
Read more

CSS Device Media Queries iPhones

-
  Phones Portrait and landscape phones @media only screen and ( min-device-width : 320px ) and ( max-device-width : 480px ) Landscape phones @media only screen and ( min-width : 321px ) Portrait phones @media only screen and ( max-width : 320px ) iPhone 4 and iPhone 4S Portrait and landscape iPhone 4 and iPhone 4S @media only screen and ( min-device-width : 320px ) and ( max-device-width : 480px ) and ( -webkit-min-device-pixel-ratio : 2 ) Portrait iPhone 4 and iPhone 4S @media only screen and ( min-device-width : 320px ) and ( max-device-width : 480px ) and ( -webkit-min-device-pixel-ratio : 2 ) and ( orientation : portrait ) Landscape iPhone 4 and iPhone 4S @media only screen and ( min-device-width : 320px ) and ( max-device-width : 480px ) and ( -webkit-min-device-pixel-ratio : 2 ) and ( orientation : landscape ) iPhone 5 and iPhone 5S Portrait and landscape iPhone 5 and iPhon...
Post a Comment
Read more