Real Code Stuff

For smart Primates & ROBOTS (oh and ALIENS ).

Sunday, March 02, 2025

View Page Source of any website page in mobile browser

No comments
Real Life Coding Stuff
Get View Page Source, View, copy and download HTML code of any website page View Page source Utility I have developed this utility to "View Page Source" of any web page. You need to simply put that page url and click on the button and you will see the View Page Source.   ...
Share:
Fore more, continue here...

Saturday, February 15, 2025

Core Web Vitals Assessment showing LCP 10.6s while google pagespeed report showing LCP 3.5s why?

, , No comments
Real Life Coding Stuff
Core Web Vitals Assessment showing LCP 10.6s while google pagespeed report showing LCP 3.5s why? So, you can face this situation while testing your website's any page speed performance score for mobile and desktop.You can see the similar test result on Google PageSpeed...
Share:
Fore more, continue here...

Friday, January 17, 2025

Image Zoom Hover Effect

, , No comments
Real Life Coding Stuff
Image Zoom Hover Effect Animations are good and it make website's pages attractive and more live. It feel user to see live things. Here you can user videos etc or gif image, But the problem is after using videos or gif file your website's page will heavy and load slow. These...
Share:
Fore more, continue here...

Tuesday, December 03, 2024

How to make center align child div

No comments
 How to make center align child div? Suppose you have 2 Div tag. And want the make inner tag center<div id="d1">    <div id="d2">      </div>  </div> Then you will use below 1 line css code as below:style="margin: 0 auto;" <div id="d1">    <div...
Share:
Fore more, continue here...

Change section tag's background image at runtime

No comments
Change section tag's background image at runtime Change <section> tag's background image at runtime. we assume that <section> tag's "back-img-url" attribute have the image link. <!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width,...
Share:
Fore more, continue here...

content visibility example

No comments
Content Visibility Example    <!doctype html><html lang="en-au"><head>    <meta charset="utf-8">    <title>Homepage</title>    <meta name="viewport" content="width=device-width, initial-scale=1"><style>.story {  content-visibility: auto; ...
Share:
Fore more, continue here...

Saturday, November 30, 2024

Lazy load iframe video using IntersectionObserver

, , No comments
Lazy load iframe video using IntersectionObserver Here is the below code that will load the iframe video when it iframe will be in the viewport.It is important that to fill the page i have used image tag with width and height.You can use your own data. <!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8"> ...
Share:
Fore more, continue here...

Auto execute code in javascript

, No comments
How to write auto execute javascript code ?We can achieve it by 2 method.1- Standard auto execute function.2- Arrow function.Standard auto execute function. <script>(function() {  const iamvar1= 'Iam var 1';  console.log('Auto Execute 1 function');})();</script>Arrow function.<script>(()=> {  const iamvar2= 'Iam...
Share:
Fore more, continue here...

Passing value in Shopify snippets and use it

, No comments
Passing value in Shopify snippets and use itYou are working on Shopify project with a snippet. In that snippet you want pass value as per your need. So how can you achieve it ?Let assume that you will use a snippet "rimg-a.liquid" in other liquid file and want to use as below. You want to pass imgurl, class and fetch value.================================================content...
Share:
Fore more, continue here...

Change video tag source url using javascript

, No comments
Change video tag source url using JavascriptYou want change <video> tag's <source></source> src when click on button in HTML and Javascript.Here is the code with example<video autoplay="autoplay" control="false" id="howto" loop="loop" muted="muted" playsinline="playsinline" poster="POSTER IMAGE URL" preload="metadata"> ...
Share:
Fore more, continue here...

Ads Inside Post

Powered by Blogger.

Archive