Little Strange Software

スマホアプリの開発を行う LittleStrangeSoftware のブログです。

言及ありがとうございますっ!!^^

 どうも!LSSです!!

 

 ブログを始めてから200日を超え、たまに読んでくださった方から「言及」いただく事があります。

「言及って何!?自分何かした??」と最初はびっくりしますよねwww

 

 要は、他のはてなブロガーさんが、自分のブログかその記事へのリンクをその方の記事内に入れていただいた事を「言及」っていうようです。

 

 ブロガー冥利につきるというか、非常にありがたい事です^^

 他のブロガーさんが、自分のブログや記事を、他の方にオススメしてくださっているという事ですから!!

 

 それで、ですね。

 

 以前からちょくちょく「言及」をいただいていたのですが、今日はちょっと特別!

 はてなブログアクセス解析をPCのブラウザで開いた時、下に「言及の一覧」というのがありますが、そのスクショ↓

f:id:little_strange:20200403013302p:plain

 

 

「過去10時間以内に」
「3人のブロガーさんから別々に」
「それぞれ違う記事を」
言及していただきました!!!

 

 それまでは「2日前」「5日前」「12日前」みたいなペースでしたが、特にアクセス数が凄いわけでもないこのLSSのブログにはまたとない快挙!!

 続くものではないと思いますが、突然の言及3連に舞い上がっています^^

 

ねずみごぞう様(id:nezumikozoo)、
さじ様(id:consaji)、
421miyako様(id:m421miyako)、

ありがとうございました!!(言及記事公開順)

 

 

 今回言及していただいた3名様のブログから、LSSが他の方に特にオススメしたい記事を逆言及してみたいと思います!(まさに独断と偏見の選択基準で!)

 

 

養分人生

 

からは、

↑こちらの記事!

「ココナラ」というサイトを利用して、アイコン作成を発注された経緯を公開されています。

アイコン外注を考えた事がある方、絵心があって逆に仕事にしたいと考えた事がある方は結構おられるのでは?と思います。

 リアルな体験談があると、イメージしやすく、検討材料になりますね^^

 

 

ゆるっと広告業界

 

からは、

↑こちらの記事!

 動画作成を勉強されていて、学習途中に作ってみた動画が2つ、見られます。

…って、すでにめっちゃかっこいいじゃないですか!!

 

 今すでにこんだけかっこよくて、動画制作のインプットが終わってからの作品はどんな事になるのか、とても楽しみです^^

 

 

海外 一人旅の野望!

 

からは、

↑こちらの記事!

 記事の「リライト」についての考察と、注意点について書かれています。 

PVが伸びるかもしれないというのは 希望的観測ですが もう一つ、記事ネタを探さなくてもいいという メリットも有ります。

ブログリライト トレンド見つけ隊 - 海外 ひとり旅の野望!

 と、ぶっちゃけた感じで書かれているのが、難しくなりそうなSEOの話も親しみやすく読めるのがさすが!と思います^^

 

 

 

 今までに言及してくださった皆様も、今読んでくださっている皆様も、誠にありがとうございます^^

 

 今後ともよろしくお願いしまーす!!

 

 

 

ごくごくお手軽に記事の一部を隠し、クリックで表示する方法【JavaScript】

 どうも!LSSです!!

 

 昨日の記事、自作小説:「嘘(長文注意)」の中で使用していた、

f:id:little_strange:20200402020754p:plain

記事中のリンクをクリックすると、

f:id:little_strange:20200402020936p:plain

こんな風に続きが出てくる仕掛け。

 

 以前に記事として公開した、【CSS】JavaScriptを使わない開閉メニュー【CSSのみで可能・はてなブログ記事で使用可能】や、 ブログで使える(かも知れない?)小ネタでも実現は可能ですが、昨日のやつのように中身の量が増えてくるとちょっと大変ですよね^^;

 

 実は昨日の記事では、より簡略化した方法を使って実現していました。

 今回はそのタネ明かし記事となります。

 

 

まずは、普通に記事を書きます

 

 隠したり出したりする部分も、普通に表示した後の状態で記事を作ります。

 

f:id:little_strange:20200402021750p:plain

↑こういう感じですね。

 

 

書き終えたら「HTML編集」に切り替えます

 

「HTML編集」画面に切り替えたら、「隠す部分の最初の部分」に、

 

<div id="uso" style="display: none;">

 

の一行を挿入します。(usoの部分は任意の名前です。適当に変更してもOK!)

 

 ただし!

 はてなブログが作っている<p> </p>の中には入れないよう注意する必要があります。

f:id:little_strange:20200402022315p:plain

↑こういう感じに挿入すればOKです^^

 

 そして、今度は「隠す部分の最後の部分」に、

 

</div>

 

を挿入します。

 

 これもさっきと同様、<p></p>の中には入れないように、

f:id:little_strange:20200402022638p:plain

↑こういう感じに挿入します。

 

 

この時点でもう隠されています!

 

 上記作業を完了した時点で、「編集 見たまま」「プレビュー」の画面では、隠すように設定した範囲が非表示になっています。(HTML編集画面でのみ確認可能な状態)

style="display: none;"

という部分が「表示しない」ように指定しているからです。

 

 あとは、「表示しない」ように指定したモノを「クリックしたら表示する指定に変える」部分を作るだけですね^^

 

 

再度HTML編集画面を開きます

 

 そして、クリックするリンクを入れたいところに、

 

<a href="#" onclick="uso.style.display='block';return false;">いくらなんでも、これはないと思ったらここをクリック</a>

 

を挿入します!

 

f:id:little_strange:20200402023524p:plain

↑画面上ではこんな感じ。

 

 これは<p></p>の中でも構いません。
(外に書いても、はてなブログの仕様により勝手に<p></p>に挟まれます)

 

 隠す範囲の中に入れるとそもそもクリックできないので、そこだけご注意ください。

 

  これで完成!です^^

 

 

aタグの中身を軽く解説します

 

<a href="#" onclick="uso.style.display='block';return false;">いくらなんでも、これはないと思ったらここをクリック</a>

 

のうち、重要なのは、

 

onclick="uso.style.display='block';return false;"

 

の部分です。

 

onclick="処理" のように書くと、クリックした時に""の中に書いたものをJavaScriptのコードとして実行される事になります。

 

uso.style.display='block';

 

 これは
「usoというIDを持った部分のスタイルシートCSS)の、displayの指定を'block'にする」

という指示になります。

 先ほどdisplay:none;に設定したために非表示になったものを、blockに変更する事で
「非表示→ブロック要素として表示」に切り替わるようになります^^

 

return false;

 

 リンクのonclickの中にコードを書いた時は、最後にこれをつけます。

…というのは、リンク(aタグ)はそもそもonclickの指定以外に
「クリックしたらhrefオプションで指定したURLにジャンプする」
という機能を持っており、クリックするとonclickのコードとジャンプの両方が実行されてしまう事になります。

 return falseをコードの最後に入れておく事で「ジャンプをキャンセル」しています^^

 

 

 

 表示⇔非表示の切り替え、これまで何通りかの方法を書いてきましたが、今回の方法だと中身を書くのも「はてなブログの編集機能」がそのまま活かせる点で、やりやすいかも知れませんね^^

 

てなとこで、今回はこのへんで!

 次回もまた、よろしくお願いします^^

 

 

 

自作小説:「嘘(長文注意)」

 どうも!LSSです!!

 

 今回は、ちょっと久々?に、20年近く前に書いた自作小説を晒してみます!!

 

 

まえがき

 

 昔、自分がアクセスしていた草の根ネットの企画で「お題」に沿った小説を書く、というのがありました。

 ある時「嘘」というお題が出た際に何作か書いており、このブログでも2作ほど紹介させていただいていましたが、今回もその時に書いたものです。

 

 

「嘘(長文注意)」

 

 私の名前は 法螺 福蔵(ホラフクゾウ)。
…こんな名前の私ですが、生まれてこのかた、一度も嘘をついた事がありません。 (終)

 

 

あとがき

 

 こんなの、投稿するタイミングって言ったら今日ぐらいですよねwww

(いや、今日だからってそれでもあんまりなような…^^::::)

 

いくらなんでも、これはないと思ったらここをクリック

 

 

 

 

ぴょんぴょん(LSS with JavaScriptの場合)

 どうも!LSSです!!

 

 

ジャンプ!

 

↑こんなものを作ってみました!

 

 

なにこれ

 

 単なる「移動+ジャンプ」の動きのサンプルです。

 ひたすら左右に往復する★にマウスカーソルを重ねるか、下にある「ジャンプ!」というリンクをクリックすると★がぴょんっとジャンプします。

 

 

作ったきっかけ

 

 

 はてなブログ仲間のさじさんが、最近動画作成を勉強されていて、AfterEffectsで可愛いキャラをぴょんぴょんさせる技術を習得されました。

のを見て、JavaScriptでやってみたくなったのです(真似しぃw)

 

 さじさんのは動きが凄く凝ってます!

 キャラも可愛いので、未見の方はぜひ見てきてください^^

 

 対して、LSSのは単に上下に★が動くだけで、真似というのもおこがましいのですが、「二次関数を使ってのジャンプの表現」をやってみたかったのですw
※ちなみに●は影のつもりですw

 

 

一応、コードはっておきます

  

<div id="gamen" style="position: relative; background-color: #eeeeee; width: 300px; height: 180px;"> </div>
<p><a href="#" onclick="if(j==0){j=1;};return false;">ジャンプ!</a></p>
<script>// <![CDATA[
x=0;
y=20;
mx=2;
j=0;
tm0=setInterval('jp()',50);

function jp(){
x+=mx;
if(x>=70){mx=-1;}
if(x<=0){mx=1;}
if(j>0 && j<20){
y=20+(100-(j-10)*(j-10));
j++;
}else{
y=20;
j=0;
}
gamen.innerHTML='<div style="position:absolute;bottom:10px;left:'+(x*4+2)+'px;color:gray;font-size:25px;">●</div>';
gamen.innerHTML+='<div style="position:absolute;bottom:'+y+'px;left:'+x*4+'px;font-size:20px;" onmouseover="if(j==0){j=1;}">★</div>';
}
// ]]></script>

 

 

タイマー使うとちょっと面白くなってきますね

 

 何か付け足したら、アクションゲームになりそうです^^

 

 実はその昔、JavaScriptでタイマーを使用したゲームを作ってみた事があったのですが、まだ構造化言語がどういうものかもよく掴めていないまま作ったので、あまり見返したくない内容になった(力技でごまかした)、という黒歴史がありますwww

 

 今でも少し、タイマーを扱う時は警戒してしまう部分もありますが、さすがにもう大丈夫かな^^

 過去の失敗にとらわれず、挑戦していきたいと思います!

 

※追記:投稿してから気づきましたが、これが「200日めの記事」となりますw

 

 

 

 

下書きにこんなものがずっと眠っていましたw【下書き供養祭】

 どうも!LSSです!!

 

 かなり以前から、自分の下書きに↓こういうものが眠っていました。

  謎の虹色巨大スターw

 

 ちなみに

 

<span style="font-size: 250px; background: linear-gradient(90deg,#ff0000,#ff0000,#ff8000,#dddd00,#dddd00,#00dd00,#00dddd,#00dddd,#0000ff,#ee00ee,#ee00ee); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;">★</span><

 

↑こんな風に書くと出現します。

 

 文字サイズを通常にして普通に文章を書くと、こんな感じですね。

 

 どうもいつまでも置いていても日の目を見なさそうなので、この際公開してしまいますw

 

 

 

 そういえばこんなのも。

 

暗闇の中に光るなにか…

 

 

 これは、

<style><!--
a.atest{padding:0.3em;background-color:#000000;color:#000000;font-size:1.5em;font-weight:900;text-decoration:none;transition:text-shadow 4s ease 0s;}
a.atest:hover{color:#000000;text-shadow:1px 1px 0px yellow,-1px -1px 0px yellow,1px -1px 0px yellow,-1px 1px 0px yellow;}
--></style>
<p><a href="#" class="atest">暗闇の中に光るなにか…</a></p>

 こんな感じです。

…あ、こっちはマウス操作専用で、スマホの場合なにも起こらないという難点があります。

 

 

 かなり長いこと寝かせていましたが、公開するタイミングを思いつかないので、ここで供養しちゃいます!w

(他にもあったりしますが)

 

 

 

 

「翔んで埼玉」映画版、ようやく見てみました!

 どうも!LSSです!!

 

「翔んで埼玉」という作品があります。

 原作は魔夜峰央、「パタリロ」で有名な漫画家さんですね。

 

 これが何故か、描かれてから何年も経ってから書評で取り上げられた事をきっかけに、大ブレイクしてついに映画化!したのが昨年の話。

 

で、それが今、AmazonPrimeで無料で見られるという事で見てみました!

  

Amazon CAPTCHA

 

 自分が原作漫画を読んだのは書評で取り上げられる前、「やおい君の日常的でない生活」という短編集で、「翔んで埼玉」はその中に含まれた一作でした。

 短編集のタイトルである「やおい君の~」も表題作として含まれていて、他に「時の流れに」という短編もありました。(「時の流れに」も地味に地方ディスり要素がありましたがw)

 

 

原作「翔んで埼玉」は未完作品です

 

 未完の理由…著者あとがきによると、そもそも描かれたきっかけというのが、著者が埼玉に引っ越したところから始まっており、だいぶノリノリで描いていたようですが、途中まで描いたところで再度引っ越し、埼玉から転出する事になり、「自身が埼玉に住んでいるから自虐ネタで済んでいるけど、そこから出てしまうと悪意があるととられかねない」という事で、止まってしまったようです^^;;;

 

が、忘れた頃に盛り上がってしまい、ついに映画化…。

 

 え?未完で止まった作品なのに、どうオチつけるんだ??と思ってましたw

 

 

映画版「翔んで埼玉」

 

 原作の話を「都市伝説」とするところから始まります。
(漫画で「まず、逃げを打ったな」に相当する部分かなw)

 

 原作のストーリーを、時には端折り、時にはオリジナル要素を追加しながら、原作になかった展開に移行していく…原作では名前だけ出ていた「埼玉デューク」が出てきたり、百美が単独行動で重要な役割を果たしたり…映画の尺におさめるためか、かなり駆け足で進んだ部分(サイタマラリアのくだりとか)もありましたが、無事に完結していましたね!

 オチがどうこう、という以前に、完結していた事に感動を覚えましたwww

 

 

他にも未完作品が…

 

 そもそもの表題作だった「やおい君の日常的でない生活」も、多くの謎を提示したまま回収される事なく止まってて、まだ描けるのでは?と思ってしまいますw

 

 何より同作者の作品「アスタロト」!

 途中で急にクトゥルフ神話が絡みだして、どうなるんだ…?ってとこで止まってるのも気になりますw

(個人的には、アスタロトは単独作品としてコミックス2冊でているものより、パタリロに出てきて長く続いてた時のほうが好き^^)

 

 

 

 でもこうして、途中で止まっていた作品が日の目を見た事で、完結される事もあるんだなぁ、と思いました^^

 

 

 

なんとなく、素数判定してみました。

 どうも!LSSです!!

 

 取り乱した時に、素数を数えて落ち着く神父さんの話がありますが、LSSは特に意味もなくなんとなく素数判定するスクリプトを書いてみました。

 

ここをクリックすると10000までの素数が出てきます(結構大量)

 

 

コード

<div id="gamen"> </div>
<script>// <![CDATA[
function sosuu(){
gamen.innerHTML='';
var cst=0;
var ss=[];
ss.push(2);
for(i=3;i<=10000;i+=2){
 sh=true;
 for(j=1;(ss[j]<=Math.sqrt(i)) && (j<ss.length) && sh;j++){
  cst++;
  if(i%ss[j]==0){sh=false;}
 }
 if(sh){ss.push(i);}
}
for(j=0;j<ss.length;j++){
 gamen.innerHTML+=ss[j]+',';
}
gamen.innerHTML+="<br/>判定回数:"+ cst + " 素数の数:"+ ss.length;
}
// ]]></script>

 

 最初の素数「2」は先に配列に入れておき、調査は3からスタート、調査対象となる数iは+=2する事で奇数だけを対象としています。

 

 調査時のループは、「調査対象の平方根を超えない範囲」の「これまでに見つけた素数(2以外)」で割り切れるか否かを判定しています。

 

…と、自分に理解できるアルゴリズムのうちでは多分これが一番低コストですが、世の中には「もっと効率の良いアルゴリズムがある」との事。

 

 ちなみにこの記事のスクリプトの場合、LSSのPCで
「10万まで調べようとすると数秒待たされる、100万まで調べようとするとブラウザが数回、待機するかどうか聞いてくる」
程度でした。

 

 Wikipediaで調べていると、微分積分を習得できなかったレベルの自分には難易度の高い話がどっさりですw

 

 

素数って何に使うの?」は、素数探索よりも難しい問題かも知れませんが、LSSの場合は「超巨大迷宮」の疑似乱数に使います^^

 Wikiに「暗号鍵に使う」という例が載っていたのを見て、同じような事例だな、となんか安心しましたw

 

 

てなとこで、今回はこのへんで!

 次回もまた、よろしくです^^