Mới đây, khi bộ phim thanh xuân Trung Quốc có tên Thắp Sáng Tôi Sưởi Ấm Em (tên gọi khác là Chiếc Bật Lửa Và Váy Công Chúa) đang gây sốt cộng đồng mạng. Ngay khi vừa lên sóng, phim đã nhận về hàng loạt những đánh giá khen ngợi và yêu thích của mọi người. Trong một phân đoạn mới đây, cảnh “thủ khoa Lý” Lý Tuân tỏ tình Chu Vận bằng đoạn code trái tim đập đập đã khiến cả cõi mạng dậy sóng. Dưới đây là đoạn Code tỏ tình thủ khoa Lý cực hot và cách chạy code trái tim ai cũng làm được mà 35Express chia sẻ đến bạn.
Đoạn Code trái tim của thủ khoa Lý
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <style> html, body { height: 100%; padding: 0; margin: 0; background: rgb(79, 100, 130); } canvas { position: absolute; width: 100%; height: 100%; } </style> </HEAD> <BODY> <canvas id="pinkboard"></canvas> <script> /* * Settings */ var settings = { particles: { length: 500, // maximum amount of particles duration: 2, // particle duration in sec velocity: 100, // particle velocity in pixels/sec effect: -0.75, // play with this for a nice effect size: 30, // particle size in pixels }, }; /* * RequestAnimationFrame polyfill by Erik Möller */ (function(){var b=0;var c=["ms","moz","webkit","o"];for(var a=0;a<c.length&&!window.requestAnimationFrame;++a){window.requestAnimationFrame=window[c[a]+"RequestAnimationFrame"];window.cancelAnimationFrame=window[c[a]+"CancelAnimationFrame"]||window[c[a]+"CancelRequestAnimationFrame"]}if(!window.requestAnimationFrame){window.requestAnimationFrame=function(h,e){var d=new Date().getTime();var f=Math.max(0,16-(d-b));var g=window.setTimeout(function(){h(d+f)},f);b=d+f;return g}}if(!window.cancelAnimationFrame){window.cancelAnimationFrame=function(d){clearTimeout(d)}}}()); /* * Point class */ var Point = (function() { function Point(x, y) { this.x = (typeof x !== 'undefined') ? x : 0; this.y = (typeof y !== 'undefined') ? y : 0; } Point.prototype.clone = function() { return new Point(this.x, this.y); }; Point.prototype.length = function(length) { if (typeof length == 'undefined') return Math.sqrt(this.x * this.x + this.y * this.y); this.normalize(); this.x *= length; this.y *= length; return this; }; Point.prototype.normalize = function() { var length = this.length(); this.x /= length; this.y /= length; return this; }; return Point; })(); /* * Particle class */ var Particle = (function() { function Particle() { this.position = new Point(); this.velocity = new Point(); this.acceleration = new Point(); this.age = 0; } Particle.prototype.initialize = function(x, y, dx, dy) { this.position.x = x; this.position.y = y; this.velocity.x = dx; this.velocity.y = dy; this.acceleration.x = dx * settings.particles.effect; this.acceleration.y = dy * settings.particles.effect; this.age = 0; }; Particle.prototype.update = function(deltaTime) { this.position.x += this.velocity.x * deltaTime; this.position.y += this.velocity.y * deltaTime; this.velocity.x += this.acceleration.x * deltaTime; this.velocity.y += this.acceleration.y * deltaTime; this.age += deltaTime; }; Particle.prototype.draw = function(context, image) { function ease(t) { return (--t) * t * t + 1; } var size = image.width * ease(this.age / settings.particles.duration); context.globalAlpha = 1 - this.age / settings.particles.duration; context.drawImage(image, this.position.x - size / 2, this.position.y - size / 2, size, size); }; return Particle; })(); /* * ParticlePool class */ var ParticlePool = (function() { var particles, firstActive = 0, firstFree = 0, duration = settings.particles.duration;function ParticlePool(length) { // create and populate particle pool particles = new Array(length); for (var i = 0; i < particles.length; i++) particles[i] = new Particle(); } ParticlePool.prototype.add = function(x, y, dx, dy) { particles[firstFree].initialize(x, y, dx, dy);// handle circular queue firstFree++; if (firstFree == particles.length) firstFree = 0; if (firstActive == firstFree ) firstActive++; if (firstActive == particles.length) firstActive = 0; }; ParticlePool.prototype.update = function(deltaTime) { var i;// update active particles if (firstActive < firstFree) { for (i = firstActive; i < firstFree; i++) particles[i].update(deltaTime); } if (firstFree < firstActive) { for (i = firstActive; i < particles.length; i++) particles[i].update(deltaTime); for (i = 0; i < firstFree; i++) particles[i].update(deltaTime); }// remove inactive particles while (particles[firstActive].age >= duration && firstActive != firstFree) { firstActive++; if (firstActive == particles.length) firstActive = 0; }}; ParticlePool.prototype.draw = function(context, image) { // draw active particles if (firstActive < firstFree) { for (i = firstActive; i < firstFree; i++) particles[i].draw(context, image); } if (firstFree < firstActive) { for (i = firstActive; i < particles.length; i++) particles[i].draw(context, image); for (i = 0; i < firstFree; i++) particles[i].draw(context, image); } }; return ParticlePool; })(); /* * Putting it all together */ (function(canvas) { var context = canvas.getContext('2d'), particles = new ParticlePool(settings.particles.length), particleRate = settings.particles.length / settings.particles.duration, // particles/sec time;// get point on heart with -PI <= t <= PI function pointOnHeart(t) { return new Point( 160 * Math.pow(Math.sin(t), 3), 130 * Math.cos(t) - 50 * Math.cos(2 * t) - 20 * Math.cos(3 * t) - 10 * Math.cos(4 * t) + 25 ); } // creating the particle image using a dummy canvas var image = (function() { var canvas = document.createElement('canvas'), context = canvas.getContext('2d'); canvas.width = settings.particles.size; canvas.height = settings.particles.size; // helper function to create the path function to(t) { var point = pointOnHeart(t); point.x = settings.particles.size / 2 + point.x * settings.particles.size / 350; point.y = settings.particles.size / 2 - point.y * settings.particles.size / 350; return point; } // create the path context.beginPath(); var t = -Math.PI; var point = to(t); context.moveTo(point.x, point.y); while (t < Math.PI) { t += 0.01; // baby steps! point = to(t); context.lineTo(point.x, point.y); } context.closePath(); // create the fill context.fillStyle = '#ea80b0'; context.fill(); // create the image var image = new Image(); image.src = canvas.toDataURL(); return image; })(); // render that thing! function render() { // next animation frame requestAnimationFrame(render); // update time var newTime = new Date().getTime() / 1000, deltaTime = newTime - (time || newTime); time = newTime; // clear canvas context.clearRect(0, 0, canvas.width, canvas.height); // create new particles var amount = particleRate * deltaTime; for (var i = 0; i < amount; i++) { var pos = pointOnHeart(Math.PI - 2 * Math.PI * Math.random()); var dir = pos.clone().length(settings.particles.velocity); particles.add(canvas.width / 2 + pos.x, canvas.height / 2 - pos.y, dir.x, -dir.y); } // update and draw particles particles.update(deltaTime); particles.draw(context, image); } // handle (re-)sizing of the canvas function onResize() { canvas.width = canvas.clientWidth; canvas.height = canvas.clientHeight; } window.onresize = onResize; // delay rendering bootstrap setTimeout(function() { onResize(); render(); }, 10); })(document.getElementById('pinkboard')); </script> </BODY> </HTML>
@chinesefilmsxt hướngg dẫn làm #trendlaptrinhtraitim siuu dễ tw của Lý Thủ Khoa cho bạn nào chưa bt nè…#lighterandprincess #chiecbatluavavaycongchua #xh #laptrinh #chinesefilmsxt #trend #phimngontinh #phimtrungquoc #lytuan #viral ♬ Way Back Home – SHAUN
Cách chạy code trái tim đập đập như thủ khoa Lý
Nếu bạn đã là một dân chuyên IT thì chắc chắn sẽ biết cách chạy đoạn code này như thế nào đúng không. Riêng với những bạn không phải là IT thì làm cách nào để đu trend này. Sau đây là 2 cách chạy code trái tim đơn giản.
Download phần mềm code
Bạn có thể có nhiều lựa chọn cho một phần mềm code trên máy tính. Với những bạn không có nhu cầu sử dụng nhiều có thể chọn download 2 phần mềm cơ bản sau là Visual Code và Sublime Text
Link download phần mềm Visual Code: Tại đây!
Link download phần mềm Sublime Text 3: Tại đây!
Sau khi tải và cài đặt phần mềm này, Hãy tạo một dự án đầu tiên. Chọn New File -> Nhập tên file với đuôi .html -> Dán đoạn code ở trên vào -> Lưu đoạn code trên.
Bước cuối cùng trong cách này, bạn chỉ cần nhấn vào nút Run và chọn Start Debugging (đối với phần mềm Visual Code) để khởi chạy dự án này. Bạn sẽ có một hình trái tim chuyển động mà thủ khoa Lý dùng để tỏ tình ở màn hình trình duyệt.
Chạy Code thông qua phần mềm Online
Riêng với những bạn không thông thạo về máy tính, cách cài và chạy source code thì có thể tham khảo cách này.
- Bước đầu tiên, hãy nhấn vào đường dẫn sau đây -> Link tại đây!
- Trình duyệt sẽ dẫn bạn đến một trang soạn thảo HTML online. Tại đây, bạn chỉ cần copy đoạn Code ở trên và dán vào ô màu đen bên tay trái. Lưu ý là hãy xóa hết đoạn code ngắn ở ô này trước khi dán nhé.
- Sau khi dán code xong, ngay lập tức ở ô phía bên tay phải sẽ hiển thị hình trái tim mà bạn mong muốn.
Cách làm này vô cùng đơn giản dành riêng cho những bạn không có quá nhiều kiến thức về lập trình. Hãy thực hiện ngay để bắt trend thú vị này nhé!
Trên đây là tất cả những thông tin, kiến thức về Share Code tỏ tình thủ khoa Lý cực hot, Cách chạy code trái tim ai cũng làm được mà 35Express chia sẻ đến bạn. Cùng xem thêm những bài viết liên quan để cập nhật thêm nhiều sự kiện, tin tức giải trí mỗi ngày.