0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

小ネタ:JSFiddleのスニペットを簡単にダウンロードする方法

Last updated at Posted at 2018-12-19

※超小ネタな上にググれば出てくる情報なのですがいつも忘れてしまうので自分の記事で書いておく事にしました。

0.初めに

私はエンジニアではないただのドシロウトです。

  • ドシロウトなのでJavaScriptは良く利用します。
  • ドシロウトなのでプログラミングの能力は低いです。
  • ドシロウトなのでCodepenJSFiddleなどスニペット共有サイトのJSをよくパクリます…(^_^;)

Codepenのダウンロードは画面上にExportボタンがあるので簡単です。

codepen

JSFiddleにはExportボタンがないのでダウンロードしたい時にいつもググってました。

1.元記事

ググればでてくる情報なので英語が苦にならない方は以下の記事をご覧ください。

Is there a download function in jsFiddle?
https://stackoverflow.com/questions/9851878/is-there-a-download-function-in-jsfiddle

この記事を読めばここ以下の内容は不要です。

2.一応説明

たまたまJSFiddleのスニペットが貼ってあった以下の記事を使って説明します。
(Windows7、Chromeでのやり方の説明です。)

任意の背景色に対して読みやすい文字色を選択する方法
https://katashin.info/2018/12/18/247

この記事に貼ってあるスニペットを「Edit in JSFiddle」で開くと以下の画像のようになると思います。

JSFiddle1

この画面のURLの後ろに/showを付けます。

https://jsfiddle.net/ktsn/s0pdmb6c/
   ↓↓↓↓↓↓
https://jsfiddle.net/ktsn/s0pdmb6c/show

以下の画像の通り右下のフレームが表示されます。

JSFiddle2

この画面で右クリックで以下の画像の通り「フレームのソースを表示」を選択します。

JSFiddle3

ソースが表示されるのであとはコピペするだけです。

JSFiddle4

3.おわりに

当たり前で誰でも知ってるのかも知れませんがドシロウトの私には長年の謎でした…(^_^;)

私みたいな初心者の方に役立てばいいなと思い書きました。

以 上

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?