Jump to content

Mike3456

Members
  • Posts

    12
  • Joined

  • Last visited

Mike3456's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. The value of id attribute is supposed to be unique. It doesn't make any sense to use a CSS selector with an element name in front of #id_name, in the sense that no two elements can have the same id value. W3C website implies that two different elements can have the same id. Theoretically, there is a special case for h1#chapter1 where there is a different element with id=chapter1 but in such case there could not be h1 with id=chapter1 in the same document anyway. Such special cases have to be described in any spec and not left out to speculations This excerpt is from --------------------------------------------- https://www.w3.org/TR/css3-selectors/#id-selectors: The following ID selector represents an h1 element whose ID-typed attribute has the value "chapter1": h1#chapter1 The following ID selector represents any element whose ID-typed attribute has the value "chapter1": #chapter1 The following selector represents any element whose ID-typed attribute has the value "z98y". *#z98y ----------------------------------------------
  2. In JavaScript, any non-empty string is supposed to evaluate to true, e.g. Boolean("0"); // true Boolean("1"); // true Boolean("2"); // true Boolean("a"); // true However, in comparisons where casting is required, JavaScript does not evaluate correctly, e.g. (true == "0") // false (true == "1") // true (true == "2") // false (true == "a") // false As you can see, the string "1" with digit 1 seems to be very special and evaluates to true while the others to false
  3. Logically, green should be #00FF00 because green is G in RGB where R is #FF0000 and B is #0000FF However, all the RGB tables list green as #008000 while #00FF00 is actually lime I played with a browser by setting background color using names and codes and clearly green=#008000 and lime=#00FF00 Some sources provide the codes incorrectly, e.g. Wikipedia says green is #00FF00 at https://en.wikipedia.org/wiki/Green It also says lime is #BFFF00 at https://en.wikipedia.org/wiki/Lime_(color)
  4. I have been playing with the float property. As an example I use two consecutive paragraphs but you could substitute other elements as well. Once I set float: left for the first paragraph, the second paragraph fails to position next to the floated first paragraph as long as its width/height are set. It works as expected with float:right, or the second paragraph has no width/height ================================ <!DOCTYPE html> <html> <head> <style> #p1 { float: left; width: 100px; height: 50px; } #p2 { width: 100px; height: 50px; } </style> </head> <body> <p id="p1">paragraph1</p> <p id="p2">paragraph2</p> </body> </html>
  5. When I remove "event" from the parameter list as listed below, it works only in Chrome. I tried the same in Firefox and it does not work. But even in Firefox, "event" has to be global because I changed the argument name to "event1" in all calls and this does not work either. This means that Firefox implements these attributes with some kind of kludge where the argument name has to be "event", i.e. global ======================== <!DOCTYPE HTML> <html> <head> <style> #div1 {width:350px;height:70px;padding:10px;border:1px solid #aaaaaa;} </style> <script> function allowDrop() { event.preventDefault(); } function drag() { event.dataTransfer.setData("text", event.target.id); } function drop() { event.preventDefault(); var data = event.dataTransfer.getData("text"); event.target.appendChild(document.getElementById(data)); } </script> </head> <body> <p>Drag the W3Schools image into the rectangle:</p> <div id="div1" ondrop="drop()" ondragover="allowDrop()"></div> <br> <img id="drag1" src="img_logo.gif" draggable="true" ondragstart="drag()" width="336" height="69"> </body> </html>
  6. I just explained that the event functions can access "event" when it is removed from the parameter list meaning the attributes are now defined as: ondragstart="drag()" ondrop="drop()" ondragover="allowDrop()" This means "event" is global and comes from JavaScript which is strange in itself because the HTML elements are outside <script> block when "event" is used a parameter
  7. On the HTML tutorial page at http://www.w3schools.com/html/html5_draganddrop.asp the example uses the attributes ondragstart="drag(event)" ondrop="drop(event)" ondragover="allowDrop(event)" and all of them use the parameter "event" that seems to be a global object. Just to test it, I removed the parameter from all three functions and made them reference the "event" directly, and it works the same way. The issue is that this "event" is not readily documented. I did some searches but none led to direct answers. Where is this "event" defined? Usually global objects have longer names with camel notation, so the name "event" itself is unusual .
  8. The jQuery tutorial has an example at: http://www.w3schools.com/jquery/jquery_dom_add.asp where they use this line to create a text/paragraph with jQuery: var txt2 = $("<p></p>").text("Text."); // Create text with jQuery "<p></p>" does not conform to any selector documented for jQuery or CSS. What is the logic behind it?
  9. I have been playing with document.getElementById("...").style to get styles of elements like a paragraph. But this thing returns only the inline styles. If a paragraph does not have an inline style with font-size then JS returns simply an empty string even though its font-size is set explicitly by an internal style font-size: 32px How do you use JS to get the style that is actually used by a given element at a given moment? ================================ <!DOCTYPE html> <html> <head> <style> p#p1 { font-size: 32px; } </style> </head> <body> <p id="p1">Paragraph p1</p> <p id="p2" style="font-size:16px">Paragraph p2</p> <button type="button" onclick="myTest()">myTest()</button> <br> <br> <script> var x1 = document.getElementById("p1"); var x2 = document.getElementById("p2"); document.write("fontSize of p1: " + x1.style.fontSize + " (" + x1.style.fontSize.length + ")" + "<br>"); document.write("fontSize of p2: " + x2.style.fontSize + " (" + x2.style.fontSize.length + ")"); function myTest() { var x1 = document.getElementById("p1"); var x2 = document.getElementById("p2"); alert("fontSize of p1: " + x1.style.fontSize + " (" + x1.style.fontSize.length + ")"); alert("fontSize of p2: " + x2.style.fontSize + " (" + x2.style.fontSize.length + ")"); } </script> </body> </html>
  10. I tried to run getElementById() directly from onclick="alert(...)" and it does not work! The alert does not even pop up! I ran it indirectly from my JS function myTest() then it works fine. I also ran another function document.hasFocus() directly from onclick="alert(...)" and it works fine. So what is so unique about getElementById() such that onclick= cannot handle? ================================================ <!DOCTYPE html> <html> <head> </head> <body> <p id="p1">Test 1</p> <button type="button" onclick="myTest()">myTest()</button> <button type="button" onclick="alert(document.hasFocus())">hasFocus()</button> <button type="button" onclick="alert(document.getElementById("p1").tagName)">getElementById()</button> <script> function myTest() { alert(document.getElementById("p1").tagName); } </script> </body> </html>
  11. For "A == B" to be true the actual values of A and B have to be equal. In the comparison "null == undefined", both "null" and "undefined" are final values that are different syntactically. They are also different semantically, because for an object to be "null" it has to be explicitly defined as such, whereas for anything to be "undefined" it has to be declared without defining (meaning without initializing). Technically, a variable can be initialized and then set to "undefined" but this is the same as if never initialized. In other words, "null" and "undefined" are different values, both syntactically and semantically.
  12. I want to create my own website(s) just to play with PHP and MySQL, to learn them. Apparently, wordpress.com is a hosting site with extensive support for PHP and MySQL. I would like to see many templates pre-written for many different applications so that I could start playing with them right away while learning. The more features of PHP and MySQL are covered the better. Obviously, the more access to the code the better. Is wordpress a good choice or any other hosting site?
×
×
  • Create New...