CSS3 – Smooth the text in WebKit browser after Text Rotation by activating the anti-aliasing

Text rotation can be done by CSS3 3D Transforms. But after the transform the text is aliased. For WebKit browser, the anti-aliasing feature could be enabled by adding the following CSS style.

  * {
    -webkit-transform: translate3d(0,0,0);
  }

Continue reading CSS3 – Smooth the text in WebKit browser after Text Rotation by activating the anti-aliasing

CSS3 – Text Rotation by 3D Transforms

Next: CSS3 – Smooth the text in WebKit browser after Text Rotation by activating the anti-aliasing

We can rotate text by using the CSS3 transform.

To rotate a text in clockwise direction with 45 degree:

p {
  -webkit-transform: rotate(45deg); /* Safari and Chrome */
  -moz-transform: rotate(45deg);    /* Firefox */
  -ms-transform: rotate(45deg);     /* IE 9 */
  -o-transform: rotate(45deg);      /* Opera */
  transform:rotate(7deg);
}

 
Continue reading CSS3 – Text Rotation by 3D Transforms

Drupal 7 – Add the latest jQuery on your Drupal 7 without conflicts

A few months ago, i tried to add the latest jQuery to a Drupal 6 website. If you are still working on Drupal 6. Please refer to Drupal – Add Extra jQuery Library.

The approach we used in the above post does not work in Drupal 7 since drupal_set_html_head() has been renamed to drupal_add_html_head() and inline Javascript is no longer supported in this new version. So today i would like to show you another solution which works in Drupal 7.
Continue reading Drupal 7 – Add the latest jQuery on your Drupal 7 without conflicts

Drupal 7 – Order EntityFieldQuery by random using hook_query_TAG_alter()

The EntityFieldQuery does not support any method to select the entities by random. A simple workaround is using the query tag and implement the hook_query_TAG_alter().

Add addTag() in your EntityFieldQuery object.

$query = new EntityFieldQuery();
$query->entityCondition('entity_type', 'node')
  ->entityCondition('bundle', '<node type>')
  ->propertyCondition('status', 1)
  ->addTag('random')
  ->range(0, 1);

Continue reading Drupal 7 – Order EntityFieldQuery by random using hook_query_TAG_alter()

HTML5 – Play sound/music with <audio> tag @ 1

Next: HTML5 – Play sound/music with <audio> tag @ 2

With HTML5, we can easily play audio file with the <audio> tag. Here is an example.

<html>
  <head></head>
  <body>
    <audio controls loop autoplay>
      <source src="music.ogg" type="audio/ogg" />
      <source src="music.mp3" type="audio/mp3" />
      Your browser does not support the audio element.
    </audio> 
  </body>
</html>

Continue reading HTML5 – Play sound/music with <audio> tag @ 1

對與錯的人生邏輯課

作者: Fernando Savater

這是一本哲學家爸爸寫給兒子的一本書。

每個人一生中都會不停面對新的挑戰、問題、環境等不同狀況,當面對這些狀況時我們不得不作出選擇,而大部份時間這些選擇都沒有很清晰的最佳答案,更甚者在選擇上往往充滿一些普世價值觀的衝突。

即使是最無私、最聰明的人亦未能肯定作出最善的決擇,更何況在價值觀被嚴重扭曲的現今社會生活的普通人。一個不重視倫理學的社會只會繼續禮樂崩壞。

“倫理學就是探求如何生活得更好的一種理智行為。”這裡的好不是你的屋子有多大或你的收入有多好,而是對自己、社會、人類共同體更善的生活。

記住不要以消極的態度面對每個人生的決擇,即使你放棄選擇也不能否認你擁有選擇的自由,因為放棄選擇也是一種選擇。所以沙特(Jean-Paul Sartre)說人是「被處以自由之刑」

作者: Fernando Savater

CSS – Hide broswer scrollbar

I am working on a website with content flying from the left to the center. When the animation starts, the horizontal scroll bar is shown and then disappeared as the animation completed. This causes a little shake on the content movement. A simple workaround is to disable the horizontal scroll bar by setting the body overflow-x to hidden.

body {
  overflow-x: hidden;
}

 

Done =)

Reference: StackOverflow – Disable browsers vertical and horizontal scrollbars