Star Ratings With Very Little CSS | CSS-Zilla
Hello Guys.. Now you make star rating with css not by image ☆ ☆ ☆ ☆ ☆ Thanks CSSZILLA TEAM
Posts
image Scale on Hover with Transition or image zoom on Hover with Transition
.csszilla{ transition: all .2s ease-in-out; } .csszilla:hover { transform: scale(1.1); }
Java script Header fixed on scroll or, add remove class with jquery based on vertical-scroll
Hello Guys Please refer this js code for your solution =========================================================== <script type="text/javascript"> // Css Zilla Fixed navigation jQuery(window).scroll(function() { var scroll = jQuery(window).scrollTop(); //>=, not <= if (scroll >= 500) { //clearHeader, not clearheader - caps H jQuery("#home").addClass("nav_top"); //alert("Css zilla welcomes you"); } }); </script> =========================================================== Css Zilla Team
Multiple Class / ID and Class Selectors
Hello Guys Please see how we select multiple Id and classes from css. In first example header is ID and callout is class implemented on same div so we write its CSS as #header.callout {} , where as In second example header is ID and callout is class implemented on same div and callout is child div of header so we write its CSS as #header .callout {} Means #header "space" .callout {} Thanks CssZilla
CSS display:table-cell child width bug in Firefox and IE,
CSS display:table-cell child width bug in Firefox and IE display table property not work in mozilla firefox but work in chrome This is your issue, See demo, This is your issue solution , see demo Thanks Css Zilla
delete all existing HTML
delete all existing HTML : by this method we can clarify that our JavaScript code is wrong or right by opening it on web page and its delete all existing html. <!DOCTYPE html> <html> <body> <button onclick="document.write(15 + 6)"> click me</button> <p> click on button and you will see the result of (15+6) </p> </body> </html> demo here https://jsfiddle.net/4opd5qw2/1/
Using document write method
Using document.write() For testing our JavaScript coding on web page to use document.write() : <!DOCTYPE html> <html> <body> <h1>My First Web Page</h1> <p>My first paragraph.</p> <script> document.write(5 + 6); </script> </body> </html> demo here https://jsfiddle.net/4opd5qw2/
JavaScript Alert pop up
By window. Alert property we can show a alert box on html page. Without click on that box we can not do anything on html page. <h1>Using window.alert()</h1> <script> window.alert("hello its javascript. click to ok"); </script> go to this link and see the live demo. https://jsfiddle.net/ssgp6mwr/11/
JavaScript Display Possibilities
Window. Alert() = for alert box when we open the HTML page Document. Write() = if is it text then we put that in quotes like…“ I am text” If it is value then we do not use quotes . innerHTMl. = to change the inner HTML values, styles anything. Console.log() = to check your methods to browser that its working or not. Click F12 and go to console and enable it then see your result of methods in browser.
Use of JavaScript in different ways in html document
We can use java script in html page by three method. · In header section · In body section (bottom of the body) · External JavaScript If we are using java script in header and body section then we must Put our code between script tag. (<script>………..</script>) We can use JavaScript same like external css. But if we are using external jacvascript. Then we don’t need script tag. And the extension of JavaScript is (.js) Example: Script.js This is the example of an external JavaScript file. Here you sees that the extension of JavaScript is .js