Internet Explorer Anime Girl
Tutorial on {HTML, CSS, JavaScript, …} + gossip on {Google, Internet, SEO, Spam, …}.
CSS: protocol-relative URL Format (updated, on its own page)
updated. You can use CSS syntax to select elements in pure JavaScript (no JQuery). See: JavaScript: Get Elements by ID, Tag, Name, Class
JavaScript Floating Box Following Scroll (updated)
by default, CSS file is assumed to be UTF-8 encoded, unless the server or other mechanism says otherwise.
however, you can declare it in your CSS file, by putting the following in the first line:
@charset "UTF-8";
reference. 〔Declaring character encodings in CSS By W3C. @ www.w3.org…〕
JavaScript Book by David Flanagan, and the Man-made Complexity in Computer Language
Javascript: Dot Notation vs Bracket Notation
lots JavaScript libs use dollar sign “$” as the name of their primary function.
It seems, it started with the prototype lib, then others picked it up, in particular jQuery.
here's a quote from stackoverflow
As far as I can see, it's not recommended to use because the ECMAScript specification states that:
The dollar sign ($) and the underscore (_) are permitted anywhere in an identifier. The dollar sign is intended for use only in mechanically generated code.
Update: The above refers to ECMA-262 3.0. However, this is no longer the latest edition. Currently, 5.1 is the latest edition. In ECMA-262 5.1 the above text is changed to:
The dollar sign ($) and the underscore (_) are permitted anywhere in an IdentifierName.
That is, it seems that they dropped the “restriction” or whatever you want to call it.
So, is this the case where practice forced a change in spec?
so many “modern” pure JavaScript based websites f�cks up the page so that basic universal browser operations broke. For example:
• Control+click or middle click on a link to open in new tab, or 【Ctrl+n】 to open new page, will not always work.
Perpetrator include Google's Google Plus, Twitter.
When a key that works only sometimes, it's annoying, but also dangerous, because after a few times of non-working, you stop using that key. Instead, user goes for the sure way of using the more cumbersome mouse.
• When a page contains Video (Flash) such as YouTube, almost always your keys such as ⇟ Page ▽, don't work anymore, because the “focus” is on Flash or some particular JavaScript scripted element, so key input got stolen. You need to click somewhere outside the video first.
From user's perspective, it's plainly annoying. However, the thing is, these fancy sites don't care, for good reasons, because, vast majority of people, probably 90%, don't even know about basic keys. Control+Click would be considered advanced.
so, how do we take this? should this be considered the inevitable progress of UI, or is it simply crassness of the corporations?
AutoScroll on Linux Google Chrome Browser
slight update. How to Embed Video with Valid HTML
the W3C group removed the “hgroup” tag in HTML5. Updated: HTML5 Tags (thx to XueFuqiao)
updated. HTML5 Video Example. (thx to XueFuqiao)
See: User Interface Design: Peepshow Windows
updated. JavaScript: Fade a Element Fixed a Google Chrome bug. See the tip at bottom to StackOverflow on a interesting JavaScript Google Chrome issue.
MIDI is really a great tech, but unfortunately, it never picked up in computer.
MIDI is tiny in size, especially great for piano music. For example, a 5 minute piano piece is only 11k bytes.
10 years ago, i'd expect by now that on each computer we have high quality sampled sound library for MIDI, so that perhaps just a 100 mega bytes you'd have entire collection of piano music in history, recorded by professionals. Not so.
Today, on the web, MIDI isn't supported in html5 audio. 〔☛ HTML5 Audio Tag Example〕 〔☛ HTML5 Tags〕 And it won't play on Linux by default.
Here's entire collection of Bach's 〈Well Tempered Clavier〉, just 529k. Music: MIDI Collection of Bach 🎶
The “pre” tag idiocy. Programing Language Design: Syntax Sugar Problem: Irregularity vs Convenience
updated with HSL color values. Complete List of CSS Color Names
new JavaScript toy. the Story of Cupid and Psyche. Hoover annotated words to see its annotation highlighted.
some selection of other stories and essays with annotation:
JavaScript: Array vs NodeList vs HTMLCollection
first, look at this page: Python, Ruby, Perl: Print Version String from Script
The language name at bottom right are done with CSS. Like this:
pre.python:after {content:"Python₂"; position:relative; bottom:0ex; right:1ex; float:right; color:gray; background-color:hsl(0,0%,95%)}
more massive update. Added array methods, and lots others. JavaScript Basics by Example
JavaScript Function Constructor
updated. learn JavaScript in 3 hours
JavaScript: How to Create Tooltip/Balloon
JavaScript Prototype: Define Your Own Methods
Customize Firefox Key Shortcuts
6 hours, much improved the JavaScript app for Unicode. See for example: Unicode: Arrow Symbols ← → ↑ ↓
updated. JavaScript: Insert HTML Element Example
discovered vanilla-js.com, its use surpasses JQuery. Amazing.
via Craig Lennox
there are lots JavaScript libs and even alternative js langs. For example, CoffeeScript, Google's Dart, Microsoft's TypeScript. My recommendation is, don't use any of it. Master JavaScript+DOM fair and square.
new. CSS Radial Gradient Examples
updated. CSS Linear Gradient Examples
this animated gif says everything about CSS. Humor: CSS Experimental Pain, Window Blind
updated. HTML Form Example
few new articles from my Programing Blog
Tech Humor: Apache vs Node.Js vs Nginx
facelift. Xah's JavaScript Tutorial
recently discovered the CSS display:inline-block. It's relatively new. It basically is like float:left but you don't have to worry about side-effects on the rest of the page, such as stopping float by clear:both. For a example of using display:inline-block, see Second Life Screenshot Gallery
updated. Pure CSS Table
updated. CSS: Flowing List
updated. CSS: z-index
revamped my CSS home page design. Xah's CSS Tutorial Only half done. More to come. Also updated: Complete List of CSS Color Names
wrote a JavaScript app. Goto Unicode Emoticons, Faces 😸, hover your mouse over (or click if you are on tablet). Unicode name and char number will show.
also created the following pages.
Can CSS z-index be negative?
yes.
Can JavaScript var name contain hyphen?
No.
Internet Explorer 10 is now available for Microsoft Windows 7. Download at http://windows.microsoft.com/en-us/internet-explorer/download-ie
Linkedin Spam Filter Collateral Damage
Linux, KDE: wow, Konqueror Sucks Major A.
I ranted about Web Design: Say No to Grey Text on White Background. And now discovered there's a site dedicated to this.
〔contrast rebellion By Zoltán Gócza, Richard Gazdik. @ contrastrebellion.com…〕
(thx to Mikay Gao)
btw, i remember reading more than one blog, by supposedly design gurus, who tell us that we should use low-contrast, because, they say, in nature nothing is in high-contrast. LOL.
this is like, Hacker Fads & Fashions: Is XML Syntax the Stupid Brother of Lisp? Hey, Check Out Their Young Sister HTML5!
On my Microsoft Windows 7 machine, only Firefox display them well (missing just 2 characters).
All other browsers, Google Chrome, Safari, Opera, Internet Explorer 9, got nothing.
I do have Unicode 6 fonts installed (Symbola, Segoe UI Symbol). Somehow these browsers are not picking it up. 〔☛ Best Unicode Fonts for Programing〕 〔☛ Unicode 6 Emoticons and Supporting Fonts〕
On Linux, default setup of Ubuntu 12.04, none of them shows up in Firefox.
What's your experience? (tell me your OS, browser, their versions, and whether you have installed special fonts yourself.)
Needs to be said again: User Interface Design: Peepshow Windows
Needs to be said again: Web Design: Say No to Grey Text on White Background
Google is banning me left and right. Now, this page 〈GNAA Weev Troll Song (Kesha — TiK ToK)〉 http://xahlee.org/music/gnaa_weev_song.html , they say is violating their AdSense rules.
Here's other moral-sensitive songs. 〈Sensitive Songs Index〉 http://xahlee.org/music/music_index_sensitive.html
I started to put Google ads in 2005. Within one month, they ban'd me, probably because i say f�ck George Bush in front page. See: 〈Google AdSense Ban on XahLee.org〉 http://xahlee.org/Periodic_dosage_dir/tr/google_adsense_ban.html
So, since 2005 to 2011, i did not run any ads.
In 2012 July, i separated out my articles to different domains, so that all my none-controversial articles (which is about 95%) can benefit from ads.
Then, Google ban'd my xaharts.org for ads. See 〈Google AdSense Ban on Ancient Asian Goddess Sculpture Page〉 http://xahlee.info/w/Google_AdSense_ban_on_ancient_sculpture_2012-09-02.html and now is warning me about that troll song.
the moral here is, if you wanna make money, stay in line! Or, be one of those unscrupulous ad-ridden SEO site or a spammer!
for my site ergoemacs.org (on emacs):
For xahlee.info (programing and math), Internet Explorer is higher:
For non-technical sites { xahlee.org ◇ wordyenglish.com ◇ xaharts.org ◇ xahmusic.org ◇ xahsl.org ◇ … }, Internet Explorer is higher still:
software jargons & tech 2012: blackbox/whitebox testing, Jenkins, Puppet, Selenium
Ruby tutorial update: Xah's Ruby Tutorial
Learned Ruby in 2 days. Here's a draft version of tutorial. Ruby Language Basics
The next few days i'll be getting onto Ruby on Rails.
Ruby experts, please hit me with comment and suggestion.
photo. Ruby Creator Cooks Python; Matz and GitCafe
Emerging Web Tech: Web Intents
JavaScript Basics Tutorial by Examples
CSS3 HSL (Hue, Saturation, Lightness) Color Samples
updated: complete list of HTML5 Tags.
There's this hurricane site with interesting tech: 〔Hurricane Sandy Bears Down on East Coast @ nation.time.com…〕
here's a few interesting things:
what JavaScript trick, lib, or CSS trick are used to achieve these? Can you create a simple HTML page example with these features?
A joke. But check out the use of CSS to render that. A Dialogue Between a Guy and a Girl: Should I Bring the Glove?. View source.
Started to use Chinese micro-blog Sina Weibo. In 2 days, i already got 2 spams. This one is funny:
There are spam selling followers on Twitter, Facebook, G+. The Chinese ain't falling behind on this.
Intro to Public-key Cryptography for Sys Admin; What's HTTPS, SSH, SSL, TLS, AES, SHA-1, MD5, …
China's Sina Weibo's UI is much better than twitter. You can list all replies to you, or all your replies to others, list mutual follower, and list private chat that also act as INSTANT chat, and pic upload that works, faster too despite lots ads. It's somewhat more like Facebook than Twitter.
+1 for China. Thumbs down on tweeter.
According to Wikipedia, Sina Weibo has 3M users, while Twitter has 5M. Sina Weibo has 1M posts per day, while Twitter 3.4M.
My account on weibo is http://www.weibo.com/xahlee/. 求关注! 求粉丝! 😸
updated: Google Search Problems & Alternative Search Engines
Tip: whenever you want to write the ampersand symbol in HTML/XML, don't use &, use FULLWIDTH AMPERSAND & instead. For example:
AT&t
vs
AT&T
Here's how your browser renders it: AT&T vs AT&T
You can set up in emacs to easily type it, or setup a key layout in any of {Windows, Mac, Linux}. See:
See also: Semantic of Symbols: HTML Entities, Ampersand, Unicode.
The Ease of Making Money by Professional Blogging
Firefox Mouse Wheel Scroll Speed, Backspace for Previous Page, Autoscroll, Configurations
IE9 bug: Browser Inline SVG Image Height Weight Scale vs Crop
Microsoft's TypeScript Will Kill CoffeeScript and Dart!
Spam Text Collection: Unicode-Obfuscated Spam
PHP & MySQL Documentation Redux, 2012
updated:
Updated: Learn PHP in one day
JavaScript: Most Frequently Used DOM Methods
If you are using Opera browser, here's 2 special config. Type them in the URL bar.
opera:gpu
opera:config
updated: Case Sensitivity in HTML5/XML/CSS/Javascript and Allowed Characters in Attribute Names
This is my estimate of how much you get from Google AdSense, based on my experience and some web research. Note that the figure could vary a lot.
From search, 1k visits ≈ $2. If from sites like Reddit, 10k ≈ $1.
updated: HTML Basics
revisting a old topic: Micropayment on the Web: It's Only a Matter of Time
Revival: HTML Marquee: Automatic Horizontal Scrolling
YouTube = Porn Fodder? and Larry Sanger Reported me to FBI
Google AdSense Ban on Ancient Sculpture 2012-09-02