All posts by ykyuen

Life is for fun~ =)

SVG clip-path doesn’t work in html5mode

I am working on an AngularJS project with html5mode enabled. I would like to implement the Card Expansion effect written on Codrops. Everything works fine but the SVG clip-path animation doesn’t work.

This is because i have ended the <base> tag in the index.html for the html5mode so the clip-path value has to be an absolute path. i.e.

<!-- fail with base tag -->
<image clip-path="url(#clipPath1)" width="1920" height="500" xlink:href="a.jpg"></image>

Change to

<!-- it works! -->
<image clip-path="url(http://localhost:10000/project#clipPath1)" width="1920" height="500" xlink:href="a.jpg"></image>

 

If you want it to work on IE, please refer to the post in the reference.

Done =)

Reference: StackOverflow – Svg clipPath in AngularJS app with url in hashbang mode

Gulp – Handle page reload in gulp-connect using connect-history-api-fallback

Page reload doesn’t work after enabled the html5mode. We have to rewrite the url and it could be easily done by using a middleware for the connect server.

gulpfile.js

var connect            = require('gulp-connect');
var historyApiFallback = require('connect-history-api-fallback');

gulp.task('connect', function() {
  connect.server({
    middleware: function(connect, opt) {
      return [ historyApiFallback({}) ];
    }
  });
});

 

Done =)

Reference: GitHub – bripkens/connect-history-api-fallback

陶傑 – 有趣小事

香港資深愛國記者程翔先生回憶中國官員魯平,其中記述魯平的「人情味」,頗為有趣:

「六四後,我和太太都離開了文匯報,跟魯平乃至整個香港左派的關係都斷了。有一天,魯平到訪香港科技大學,在這處見到我太太,立刻偏離原來前進的方向,特意走過來與我太太握手問好。相比之下,有些原來的左派的朋友,對我們避之唯恐不及,則魯平的風度及對朋友的真摯,是令人難忘的。」所以,程先生說:「從私人的角度,我對魯平是很尊敬和感激的。」

此段珍貴文字,由文化角度,有兩大看點。

第一,是「六四」後,作者的「左派朋友」對作者之「唯恐走避不及」。為什麼呢?因為程先生那時已被「定性」為反共反中人物,在中國人社會,一旦「定性」,你身邊本來跟你要好的人,當然「唯恐走避不及」。
Continue reading 陶傑 – 有趣小事

陶傑 – 暴動英雄大紫荊

香港「工運領袖」、一九六七年文革暴動執行人兼「大紫荊」得主逝世,特區政府林鄭月娥宣哀悼,指這位老人「對勞工福利有突出建樹」,引起爭議。

這位老人以「反英抗暴」成名。但是特府鬼鬼祟祟只提其「勞工福利」的「突出建樹」(有何「突出建樹」?最低工資?標準工時?公積金還是男女同工同酬,都由這位老人倡導促成?),不敢提這位老英雄一九六七年的反英愛國事蹟,正如中國評論毛澤東,只提毛澤東對十年來中國大陸風行的「湖南毛家菜」、「毛主席紅燒肉」之風行的貢獻,不提毛主席的文化大革命。對香港愛國老英雄的一生功業,強行閹割,難怪香港特府的政務官,長期被愛國陣營視為「港英餘孽」。

特府說要推行中國歷史教育。看見特府對我們愛國老英雄那副鬼祟閃縮的「歷史評價」,也難怪香港家長有錢的,都會像梁特和林鄭司長,明智地將子女送當年「反英抗暴」的仇恨對象──英國去讀書。

至於這位姓楊的老人,值不值得「大紫荊」?同為大紫荊勳賢的吳康民先生論定,說得比林鄭中肯:「因他文化不高,缺乏辯才,所以也不算是一位出色的工會領袖。」這樣一來,所謂「對勞工福利有突出建樹」之說,亦即刻引人發笑。
Continue reading 陶傑 – 暴動英雄大紫荊

陶傑 – 人性的盲點

從利比亞乘船北渡地中海到意大利的難民之中,將會混雜扮成難民的恐怖份子。

這還不算,伊斯蘭國還直接經營難民貿易:由伊斯蘭國控制的港口,放難民船出海,由船主向難民收錢,再與伊斯蘭國對分。

這樣一來,伊斯蘭國退可以坐地賣配額賺錢,進則可以放幾個恐怖份子上船混入歐盟。歐盟的左膠政府,以「人道理由、歐洲的人權法例」,不能拒收。恐怖組織利用歐洲此一盲點,名正言順將恐怖活動在歐洲擴散。

這就是左膠對人類的危害。他們的「包容」、「平等」、社會福利,將書本上的烏托邦理論,實踐起來,內則限制本身的言論和創作自由,動不動就禁制「歧視」,但外則向恐怖主義的敵人大開方便之門。左膠對於伊斯蘭極端言論,在國內保障,因為恐怖份子是有色人種,來自第三世界;對於本國的抗議、反對、警醒的聲音,都視之為仇敵,因為他們本身是信奉耶教的白人。一九五二年的麥卡錫,令左派驚嚇到今日。
Continue reading 陶傑 – 人性的盲點

陶傑 – 董伯說反共

前特首董伯忽然公開宣佈:「反共的人不可以選特首」,遭到行政會議人員葉劉淑儀公開駁斥。葉劉嚴正指出:這條「標準」,她從沒有聽過,「並不是負責政改的中央官員的意見,是董伯個人看法,國際公約規定不可以因政見限制參選。」

葉劉的政治智慧,比董伯高。因為論「反共」,董伯的尊翁董浩雲,在一九四九年「解放」之後,其船隊還明目張膽打着青天白日的中華民國國旗。同時期在大陸,敢展示這張旗的,犯「現行反革命」罪,一定槍斃。論反共,董伯的爸爸,有案可稽。

有人說:董浩雲老先生反共,不等於兒子也反。在西方文明社會,這樣的道理成立,但是中國講出身成份,共產黨有一句話:「老子英雄兒好漢,老子反動兒混蛋」,因此,第一任特首讓董伯幹了,你問問今日大陸的毛左愛國人士,像戚本禹、聶元梓、毛新宇,他們會告訴你,是國家看錯了人。

李光耀一生,本質反共,董伯的政府,不是口口聲聲說要模仿李光耀嗎?李光耀如果是在棺材裏聽到阿董這句Gag,也會冷笑一聲,用英文暗罵一聲:What a load of bull-shit。
Continue reading 陶傑 – 董伯說反共

Offset the anchor link for sticky header

If you have a sticky header (Position fixed header on the top of the html page), your anchor link with CSS ID would not work as you expected. The target section would be covered by the position fixed header.

You can use the following CSS to offset the fixed header height.

/* The target CSS ID with :before pseudo class */
.offset:before { 
  display: block; 
  content: " "; 
  height: 150px;      /* Give height of your fixed element */
  margin-top: -150px; /* Give negative margin of your fixed element */    
  visibility: hidden; 
}

 

Done =)

Reference: Offsetting Anchor Hash Tag Links To Adjust For Fixed Header

陶傑 – 種族滋擾

英國大選,一個叫麥雅倫(Alan Mak)、在英國出生的香港第二代華裔當選。不出本人所料,華文傳媒即刻將這位麥先生標籤出來,追問一連串令麥雅倫感到很尷尬問題,如「你準備怎樣加強中英港關係」之類。麥議員很識大體,一句頂回:「我只為我的選區服務,我不說中文,請勿強調我的種裔出身。」意思就是:請少來「中國人揚威海外」那一套,我對中國事務沒有興趣。

這樣一來,中國網民即刻破口大罵。麥雅倫對那麼多伸過來拉扯衣角認親攀戚的中國人,只不過畧一閃避,即刻見識到右翼中華種族主義的仇恨。

在西方,強調少數人的種族膚色,是種族主義意識。而且,如果你沒有民族自卑感,也不必因為一個「炎黃子孫」的「同胞」在外面上了位而感到特別興奮。譬如匈牙利裔的前法國總統薩科齊,入主愛麗榭宮,而且娶了一個法國美女匈牙利人沒有放鞭炮慶祝;薩科齊下台被控貪污,匈牙利國民也沒有垂頭喪氣。
Continue reading 陶傑 – 種族滋擾

陶傑 – 香港法官愛國難

終審庭首席大法官再說一次:法官判案,超然中立,不涉政治。

但是中方與愛國愛港陣營,要求香港的法官要「愛國」。愛國,就是政治。「警察拉人,法官放人」,就是中方和愛國陣營對法官的又一次嚴重警告。

香港主權移交十八年,在龐大持久的「統戰」攻勢之下,香港社會各界,基本已經攻陷,也就是說,都已陸續歸隊:工商、漁農、新聞、金融、教育、醫療、會計、演藝……也就是說,最初不太愛國的,在「統戰」之下,漸漸改變了思想。

令你由不愛國變成愛國,中國有辦法。對付工商最容易,給你大陸市場,你馬上就愛國了。錢賺得越多,愛國感情越濃。
Continue reading 陶傑 – 香港法官愛國難