This post will describe about some techniques to comment a blogger site with DHTML content. especially dedicated to Ifinder
DHTML is nothing but Dynamic HTML and which is the combination of HTML, Javascript, CSS, HTML DOM. As we discussed in HTML comments for Blogger site post, using NCcode we can post HTML contents which gives you customized style of comments. Since external javascript are not secure, though NCcode recognize javascript, it will not accept external javascript. But javascript can be used without functions and variables.
below are the few examples for including javascripts in blogger comments(for non-techies please replace the highlighted parts with your images.)
Effect: on click, image toggle
NCcode:
〈img onclick="if (this.src=='http://www.w3schools.com/dhtml/bulboff.gif'){this.src='http://www.w3schools.com/dhtml/bulbon.gif';}else{this.src='http://www.w3schools.com/dhtml/bulboff.gif';}" border="0" src="http://www.w3schools.com/dhtml/bulboff.gif" width="100" height="180" /〉
Effect: Anchor tag on particular pixel(Map effect)
NCcode:
〈img src="http://www.w3schools.com/jsref/planets.gif" width="145" height="126" usemap="#planetmap" /〉〈map name="planetmap"〉 〈area id="venus" shape="circle" coords="124,58,8" alt="Venus" href="http://www.w3schools.com/images/venglobe.gif" /〉 〈/map〉
Effect: Hide/unhide the comments
〈input type="button" value="Hide text" onclick="document.getElementById('pic').style.visibility='hidden'" /〉〈input type="button" value="Show text" onclick="document.getElementById('pic').style.visibility='visible'" /〉
〈p id="p1"〉you can hide me.〈/p〉
Effect:mouse over enlarge the image
NCcode:
〈img id="image" src="http://www.w3schools.com/dhtml/bulbon.gif" onmouseover="this.width='200';this.height='360';" onmouseout="this.width='100';this.height='180';" width="100" height="180" /〉
If you notice you would have found one thing that is javscript can be included in events like onMouseout, onMouseover, Onclick... you can develop complex javascripts with in events and you can make the effect in blogger comments. If you use image toggling effect, then it would reduce your page loading time comparing to large images
Suggestion for Blog owner:
If you are good in javascript, then allow the javascripted comments while moderating your blog comments. If not Please don't allow any javascripted comments it may have span links.
Reference:W3shools
DHTML is nothing but Dynamic HTML and which is the combination of HTML, Javascript, CSS, HTML DOM. As we discussed in HTML comments for Blogger site post, using NCcode we can post HTML contents which gives you customized style of comments. Since external javascript are not secure, though NCcode recognize javascript, it will not accept external javascript. But javascript can be used without functions and variables.
below are the few examples for including javascripts in blogger comments(for non-techies please replace the highlighted parts with your images.)
Effect: on click, image toggle
NCcode:
〈img onclick="if (this.src=='http://www.w3schools.com/dhtml/bulboff.gif'){this.src='http://www.w3schools.com/dhtml/bulbon.gif';}else{this.src='http://www.w3schools.com/dhtml/bulboff.gif';}" border="0" src="http://www.w3schools.com/dhtml/bulboff.gif" width="100" height="180" /〉
Effect: Anchor tag on particular pixel(Map effect)
NCcode:
〈img src="http://www.w3schools.com/jsref/planets.gif" width="145" height="126" usemap="#planetmap" /〉〈map name="planetmap"〉 〈area id="venus" shape="circle" coords="124,58,8" alt="Venus" href="http://www.w3schools.com/images/venglobe.gif" /〉 〈/map〉
Effect: Hide/unhide the comments
you can hide me.
NCcode:〈input type="button" value="Hide text" onclick="document.getElementById('pic').style.visibility='hidden'" /〉〈input type="button" value="Show text" onclick="document.getElementById('pic').style.visibility='visible'" /〉
〈p id="p1"〉you can hide me.〈/p〉
Effect:mouse over enlarge the image
NCcode:
〈img id="image" src="http://www.w3schools.com/dhtml/bulbon.gif" onmouseover="this.width='200';this.height='360';" onmouseout="this.width='100';this.height='180';" width="100" height="180" /〉
If you notice you would have found one thing that is javscript can be included in events like onMouseout, onMouseover, Onclick... you can develop complex javascripts with in events and you can make the effect in blogger comments. If you use image toggling effect, then it would reduce your page loading time comparing to large images
Suggestion for Blog owner:
If you are good in javascript, then allow the javascripted comments while moderating your blog comments. If not Please don't allow any javascripted comments it may have span links.
Reference:W3shools
