月別アーカイブ: 2010年4月

WordPress

HighSlide 導入

コメントする

画像のポップアップ表示用ツールもたくさんあるが、ワンパターン・スタイルのプラグインよりも、使い慣れた HighSlide の方がいいかと full.js を本家から導入した。

back34

数年前とある雑誌の CD-ROM に載っていたデスクトップ背景。

時に Ubuntu のデスクトップに使ったりする。

当の CD-ROM はトレイに入れても「OS がありません」と宣う。

 


往時只能回味

プラグインの方は早々に削除したので、細かな機能までは確認していませんが、Youtube もポップアップ表示ができる。

ただこのテーマが strict なので、インラインフレームは使えないかも知れない。

<a href="http://www.youtube.com/v/mlifFcalSKc&amp;hl=ja_JP&fs=1&rel=0" class="fancybox youtube">
<img src="https://blog.utara.jp/wp-content/uploads/wangshi.jpg" alt="往時只能回味" title="往時只能回味" width="120" height="89" class="alignleft size-full" /></a>

ただこのパターンは Ubuntu 上の Flock flock ではうまく反映されないことが分かっている。

その Flock は問題ないが、それにしても Firefox firefoxで syntaxhighlighter が妙な出力をする。 熊ったもんだ。

現在は Fancybox for WordPress が iframe 指定で動作しないので Easy FancyBox に変更した。
class 名は iframe または youtube どちらでもいいようだ。
こちらはサムネイルサイズが固定化されるのが難点。

WordPress

shBrushMxml.js は対応するか

コメントする

開始行が mxml だとマズイのかな？

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="413" height="439" backgroundColor="white">
<!--mx:Style source="jukebox.css" /-->
<mx:Script>
<![CDATA[
  import mx.controls.Alert;
  public var arrBigImg : Array;
  public function init() :void
  {
arrBigImg = [ 'mat/lemon200.jpg',
  'mat/redsun200.jpg'/*,
  '../img/c230.png' */];
  }
  //小さい画像をクリックした場合
  private function clickAction(cnt: int) :void
  {
bigImg.source = arrBigImg[cnt];
  }
]]>
  </mx:Script>

  <mx:Panel width="286" layout="absolute" top="0" left="5" bottom="10" backgroundAlpha="1.0" alpha="1.0" creationComplete="init()">
<mx:Image top="10" left="5" height="256" id="bigImg" source="" showEffect="Rotate" width="256"/>
  </mx:Panel>
  <mx:Image id="sImg1" y="50"  right="15" width="96" height="96" source="@Embed('mat/lemon200.jpg')" click="clickAction(0)" />
  <mx:Image id="sImg2" y="181" right="15" width="96" height="96" source="@Embed('mat/redsun200.jpg')" click="clickAction(1)" />
  <!--mx:Image id="sImg3" y="292" right="0" width="128" height="128" source="@Embed('../img/c133.png')" click="clickAction(2)" /-->
</mx:Application>

syntaxhighlighter.php に追加しただけではダメなのか。

// Register some popular third-party brushes
wp_register_script( 'syntaxhighlighter-brush-mxml',       plugins_url('syntaxhighlighter/third-party-brushes/shBrushMxml.js'),       array('syntaxhighlighter-core'), '20100428'     );
// added for mxml

本家の ver.1.5.1 でないと働かないのかなあ … Another Lint で怒られるので xml に戻す。

WordPress

syntaxhighlighter css test

コメントする

CSS は

/* Website Title
---------------*/

div#header p.siteName {
    margin: 25px 60px 10px;
    line-height: 1;
    font-size: 144%;
    font-weight: bold;
    text-indent: -9999px;
    height: 58px;
    width: 285px;
    background: url(images/selatan.png) no-repeat left top;
}

div#header p.siteName a {
    text-decoration: none;
    color: #417698;
    display: block;
    height: 58px;
    width: 285px;
    overflow: hidden;
}

div#header p.siteName a:hover {
    color: #000;
}

div#header p.siteName a:focus {
    outline: none;
}