RECENT TOPICS » View all

Kanji stroke order on hover no longer works?

Index » Feedback

  • 1
 
Reply #1 - 2011 March 28, 10:13 am
aphasiac
Member
From: 台湾
Registered: 2009-03-16
Posts: 1031

Hi, I use this stroke order font to enhance my reviews:

http://rtkwiki.koohii.com/wiki/Kanji_st … r_on_hover

However, in the last 2 weeks at some point it stopped working for me. Has something changed regarding the DIV tags on the main review site? Is it broken for everyone else??

Cheers!

Last edited by aphasiac (2011 March 28, 10:18 am)

Reply #2 - 2011 March 28, 10:56 am
ファブリス
Administrator
From: Belgium
Registered: 2006-06-14
Posts: 3699
Website

It's easier to change the font now actually, because there is a global CSS class set on all spans of CJK text.

The CSS rule .cj-k will target all elements that contain Japanese characters. These elements can be DIVs or SPANs or anything else so don't match the tag name, just the class name. It's better because it won't break regardless of how the html is updated.

Change the CSS rules with:

Code:

.cj-k:hover { font-family: "KanjiStrokeOrders" }

If you want to change the font size, then yeah, you'll need to use other classes, eg.

Code:

.fcData-kanji:hover { .... }

Let me now if that works.

That RtkWiki page will need updating.

Rules like "div#kanjibig p span.fcData-kanji" are too specific. These are bound to break with website updates. Better use "!important" to override the defaults:


Code:

.cj-k:hover { font-family: "example", serif !important;  }
Reply #3 - 2011 March 28, 5:01 pm
aphasiac
Member
From: 台湾
Registered: 2009-03-16
Posts: 1031

Hi, thanks for the reply - that .cj-k rule is really cool!

Here's the Stylish rule that fixes the issue:

.cj-k:hover {font-family: "KanjiStrokeOrders" !important }

I will update the wiki to share this info.

EDIT: I realised this rule should only target the main kanji on the review cards; this is because having the stroke number kanji change font when you hover over them is pretty weird (plus you may use other kanji on the site in the future) So the rule is now:

.fcData-kanji:hover {font-family: "KanjiStrokeOrders" !important }

I will update the wiki again with this new information.

Last edited by aphasiac (2011 March 28, 5:15 pm)

Advertising (register and sign in to hide this)
JapanesePod101
Sponsor
 
JapanesePod101
Reply #4 - 2012 March 05, 8:43 pm
CharleyGarrett
Member
From: Cusseta Georgia USA
Registered: 2006-05-25
Posts: 301

I've added what I thought was the recommendation to my Stylish script that I named
KanjiStrokeOrderOnHover.  The .png image does not contain the same code as the quotation.  But the script doesn't work, at least not for me.  Any help?

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain('kanji.koohii.com'), url-prefix('http://kanji.koohii.com') {
.fcData-kanji:hover {font-family: "KanjiStrokeOrders" !important }
}

  • 1