てがろぐ - Fumy Otegaru Memo Logger -

お手軽一言掲示板(この辺の文章は「管理画面」の「設定」内にある「フリースペース」タブから編集できます。)

動作サンプルです。 ご自由にお試し下さい。パスワードguest管理画面もお試し頂けます。
■いま見ているスキンは「標準スキン」です。他に、 昔のツイッターっぽいスキン(ブルー)昔のツイッターっぽいスキン(ピンク)付箋型スキンシンプル日記スキンジャーナル(日誌)スキンブログタイプスキン(タイトル付きブログっぽくできるスキン)、 黒板スキンチャットタイプスキンがあります。
てがろぐCGIの配布・解説ページに戻る

or 管理画面へ

No.4513, No.4512, No.4511, No.4510, No.4509, No.4508, No.45077件]

画像テストさせてください
policy-img02.jpg

by admin. <13文字> 編集

もしかして今日はめちゃくちゃ暑い……?🍨🍨🍨

🍨Re:4510◆全体としてどんなHTMLになっていて、そこにどんなCSSをお書きになっているかが問題ですので、現物を見せて頂かないと何とも言い難いかなと思います。実際に公開されているURLをお書き頂くか、ここでOPENにできない場合はメールでお知らせ下さい。

なお、それも避けたい場合には自力で調査頂くほかないですが、とりあえず、「ブラウザがHTMLをどう解釈していて、そこにどんなCSSが適用されているのか」は、ブラウザの開発者ツール(※[F12]キーを押すか、[Ctrl]+[i]キーを押すなどすると出てきます)を使うとよく分かります。

by nishishi. 回答/返信 <300文字> 編集

4510です。
すみません、リンクのところで書き方をミスしてしまい、変な表示になってしまいました。申し訳ないです。

by admin. <57文字> 編集

こんばんは。
てがろぐには本当にお世話になっています。ありがとうございます。
一部分でCSSが効かなくなることについてご相談したいです。


私のサイトでは、フリースペースを使ってHTMLで書いている部分があるのですが、

<p><span class="deco-hoge">言葉</span><ruby><rb>言葉</rb><rt>ことば</rt></ruby></p>

上記のようにspanタグで囲まれた部分とrubyタグで囲まれた部分が隣り合うと、spanタグで指定したclass="deco-hoge"のCSSが効かなくなります。

※実際には下記のようにaタグでも囲っているのですが、CSSが効かないのは同じです。

<p><span class="deco-hoge">言葉</span><a href="https://&quot;&gt;&lt;ruby&gt;&lt;rb&gt;言葉</rb><rt>ことば</rt></ruby></a></p>



<p><span class="deco-hoge">言葉</span></p>

上記のように、rubyタグを取り除くと、CSSは問題なく効きます。

rubyタグを使ってもCSSが効くようにしたいのですが、どうすればいいでしょうか。何かご教授いただけますと幸いです。
お手数おかけして申し訳ないのですが、よろしくお願いいたします。
畳む

by admin. <588文字> 編集

昼食はチャーハン。

🍵Re:4508◆カテゴリに属する投稿の総数に応じて、リンクの表示/非表示を切り替える、という意味ですかね?
そうだとすると、JavaScriptを使えば実現できます。以下の①~④のソースを書いてみて下さい。

①まず、外側スキンに <span class="counter">[[INFO:TARGETPOSTS]]</span> と書いておきます。この [[INFO:TARGETPOSTS]] の記述は、もしかしたら既に書いてあるかもしれません。標準添付の各スキンだと書いてあります。書いてある場合はそれを流用しても良いです(※余計な単位を含めないようご注意下さい)し、新たに追記しても良いです。何にしても、該当件数の数値だけが「counter」というclassの要素に含まれるようにします。

②次に、今の表示を逆順で表示するリンクを、例えば
<span class="revlink"><a href="[[REVERSE:URL]]">今の表示を[[REVERSE:NAME]]で見る</a></span> のように書いておきます。リンクの書き方はどうでも良いので好きなようにして下さい。要は、表示/非表示を切り替えたい内容を「revlink」というclass名の付いた要素で囲めば良いだけです。

③さらに、JavaScriptを書きます。
<script>
document.addEventListener('DOMContentLoaded', function() {
   // counterクラスの要素を取得して表示件数を得る
   var counterElmnt = document.querySelector('.counter');
   var counterValue = parseInt(counterElmnt.textContent);

   // revlinkクラスの要素を取得
   var revlinkElmnt = document.querySelector('.revlink');

   // counterの値に応じてrevlinkの表示・非表示を切り替え
   if (counterValue >= 30) {
      revlinkElmnt.style.display = 'inline';
   } else {
      revlinkElmnt.style.display = 'none';
   }
});
</script>


④最後に、これら全部を [[IF(selected-cat): :IF]] で囲みます。(①はこの範囲外にあっても構いませんが。)

上記のようにすると、
  • カテゴリ限定表示時にだけ、(=④)
  • いま見えている総投稿数が30件以上のときに限って、(=③)
  • 逆順に表示するリンクが見える。(=②)
……となるはずです。たぶん。(動作確認はしていないのですが。)

なお、①の数値は、そのまま何らかの表示に使っても良いですし、使い道がない場合はCSSで非表示にしておけば良いです。 .counter { display:none; } みたいな感じで。もし既に counter というclass名を別の用途で使っている場合は、上記のソースでは別の適当なclass名に置き換えて使って下さい。(※お使いのスキン内で、既に counter というclass名を使っている場合に、上記のソースのままを書くと、総表示件数を正しく取得できない可能性があります。)

by nishishi. 回答/返信 <1519文字> 編集

>>4507ああああまりにも基本的な機能すぎて逆にスルーしてました……わざわざめんどうなことしなくてもよかったんですね…… ありがとうございます!
もう一つ質問なのですがURL末尾にreverseを付ける(逆順に見る)をカテゴリ限定かつそのカテゴリの投稿が30件以上あれば表示、なければ非表示にってできますかね……?

by admin. <158文字> 編集

冷凍餃子を追加で買ってきたので餃子備蓄が増えました。🥟🥟🥟

🥟Re:4506◆おそらく、下げる機能がお役に立つのではないかと思います。まず、この図の設定位置で『カテゴリ限定表示時』にチェックを入れておきます。その上で、カテゴリ「あ」の投稿をすべて『下げる』にチェックを入れて投稿していれば、その投稿は(通常の一覧表示時では非表示になり)カテゴリ限定表示時(などの、この図で設定した状況)だけで見えるようになります。

by nishishi. 回答/返信 <272文字> 編集

DASHBOARD

■複合検索:

  • 投稿者名:
  • 投稿年月:
  • #タグ:
  • カテゴリ:
  • 出力順序:

■新着画像リスト:

Perlのバージョンを上げる設定(さくらインターネット)

全317個 (総容量 36.08MB)

■日付一覧:

■日付検索:

■カレンダー:

2024年6月
1
2345678
9101112131415
16171819202122
23242526272829
30

■最近の投稿:

■フリースペース:

ここは、CGIの設定画面から自由に文章を入力して掲載できるスペースです。スキンを編集しなくてもCGI上から手軽に内容を変更できます(HTML使用可)。
動作サンプルです。◆他のスキン:標準スキン, 昔のツイッターっぽいスキン(ピンク版), 付箋型スキン, シンプル日記スキン, ジャーナル(日誌)スキン, ブログタイプスキン, チャットタイプスキン, 黒板スキンてがろぐCGIの配布ページに戻る

編集

▼現在の表示条件での投稿総数:

7件

▼最後に投稿または編集した日時:

2025年5月30日(金) 23:55:03〔7時間前〕

RSSフィード

動作サンプルです。 ご自由にお試し下さい。パスワードguest管理画面もお試し頂けます。
■いま見ているスキンは「標準スキン」です。他に、 昔のツイッターっぽいスキン(ブルー)昔のツイッターっぽいスキン(ピンク)付箋型スキンシンプル日記スキンジャーナル(日誌)スキンブログタイプスキン(タイトル付きブログっぽくできるスキン)、 黒板スキンチャットタイプスキンがあります。
てがろぐCGIの配布・解説ページに戻る