1

私は何度も試し、このボードを検索しましたが、次のような単純なことはできません。

http://xs.to/xs.php?h=xs139&d=09201&f=menu676.gif

次のようなメニューをレンダリングしたい：

アイテム1| アイテム2| アイテム3| ....など..。

「アイテム1」ANDパイプ文字「|」=sIFRでレンダリングされたテキスト

HTML：

<div id="menu"> item 1 <span class="pipe"> | </span> item 2 <span class="pipe"> | </span> </div>

この部分は、一番下のHTML内にあります。

<script type="text/javascript">

var metaroman2 = 

{ src: 'shared/sifr/metaroman2.swf' , ratios:[....7, 1.32....] }; 
sIFR.activate(metaroman2);

sIFR.replace(metaroman2, {

selector: '#menu', css: ['.sIFR-root { background-color: #F9F9F9; color: #1F2956; font-weight:bold;}'], wmode: "transparent" }); 
sIFR.replace(metaroman2, {

selector: '.pipe', css: ['.sIFR-root { background-color: #F9F9F9; color: #1F2956;}'], wmode: "transparent" }); 
</script>

CSS：

.sIFR-active .pipe {

visibility : hidden; line-height : 1em; margin-left : 5px; margin-right : 5 px;
} 
.sIFR-active #menu {

visibility : hidden; line-height : 1em;
}

問題は、「|」ということです 文字は、単語の最後に（5px）の間隔を空けずに配置されています。

欲しい方法：アイテム1[5pxスペース]| [5pxスペース]アイテム2

私が得るもの：アイテム1|アイテム2

他の方法：

画像で試してみると、画像がまったく表示されません。（"sIFR.fitExactly = true"がsifr-configに設定されています）

「画像」とは、パイプサインの代わりに、パイプサインを表す画像です。

html：

<div id="menu"> item 1 <img src=...> item 2 <img src=...> </div>

css：

.sIFR-active #menu {

visibility : hidden; line-height : 1em;
}

スクリプト：この部分は、一番下のHTML内にあります。

<script type="text/javascript">

var metaroman2 = 

{ src: 'shared/sifr/metaroman2.swf' , ratios:[....7, 1.32....] }; 
sIFR.activate(metaroman2);

sIFR.replace(metaroman2, {

selector: '#menu', css: ['.sIFR-root { background-color: #F9F9F9; color: #1F2956; font-weight:bold;}'], wmode: "transparent" }); 

</script>

コードが乱雑になって申し訳ありませんが、理解していただければ幸いです。

（編集：sIFRを数日間使用しており、単純な見出しを比率の作業に完全に置き換えていますが、上記は私を打ち負かしています）

4

1 に答える 1

0

すべてのメニュー項目を個別の要素にラップし、それをsIFRセレクターに置き換えます。パイプは置き換えないでください。それらをスパンにラップし、CSSのみでスタイルを設定します。

これらの置き換えられたアイテムとスパンは、すべてフローティングブロック要素である必要があります。

html：

<div id="menu"><a href="#">Item 1</a><span>|<span><a href="#">Item2</a>...

css：

#menu a , #menu span {
    display: block;
    float: left;
}
于 2009-05-11T13:23:38.493 に答える