2016年6月24日のブックマーク (8件)

  • Wordpressのビジュアルエディタ(WYSIWYG/ウィジウィグ)のオススメは?-CKEditor For WordPress | HARASHOW TIMES

    ホーム ウェブマーケティング Wordpressのビジュアルエディタ(WYSIWYG/ウィジウィグ)のオススメは?-CKEditor For WordPress 2016.01.12 ウェブマーケティング WordPressのビジュアルエディタ(WYSIWYG/ウィジウィグ)のオススメは?-CKEditor For WordPress 久しぶりにブログを再会しまして、ワードプレスをいじくり倒しております。 んー、いいですね!ワードプレス。私はMTの世代なのでどうしてもMTベースの発想になってしまっていたのですが、ワードプレスが覇権を握った理由がわかりました。 テンプレートはOPENCAGEさんの「アルバトロス」を使っています。かなり使い勝手のいいテンプレートで今のところお気に入り。 シンプルで無駄がなくて最高です。モバイル対応も既存のワードプレステンプレートの中では一番綺麗に表示してくれ

    Wordpressのビジュアルエディタ(WYSIWYG/ウィジウィグ)のオススメは?-CKEditor For WordPress | HARASHOW TIMES
  • Node.jsユーザーなら押さえておきたいnpm-scriptsのタスク実行方法まとめ - ICS MEDIA

    ウェブ制作の現場では作業の自動化を行うことが多いです。Node.jsインストール時に付属するnpm (Node Package Manager)を使用すれば、タスク処理が実現できます。 npmとはNode.jsのモジュールを管理するためのツールであり、タスク処理にはnpmの機能のnpm-scriptsを使用します。記事はnpm-scriptsを使ったタスク実行環境が構築できることを目標に解説します。 そもそもnpm-scriptsとは何か? npm-scriptsとは、package.jsonファイルに記述可能なシェルスクリプトのエイリアスです。エイリアスとはコマンド名を別のコマンド名に置き換えることです。以下のnpm-scriptsはHello world!!を表示させるコマンドのエイリアスを作成する例です。 ▼package.jsonファイル { "scripts": { "say"

    Node.jsユーザーなら押さえておきたいnpm-scriptsのタスク実行方法まとめ - ICS MEDIA
    bapho
    bapho 2016/06/24
  • HTML5で色分解した写真をWebGLで3D表示するAway3Dデモ - ICS MEDIA

    先日開催したAway3D勉強会の発表のフォローアップ記事となります。 写真をRGB3原色に分解して3次元で表示するHTML5 + WebGLのデモを作ってみました。ステージをドラッグすると写真が赤・青・緑の3原色に分解されて表示されます。ライブラリはJSライブラリの「Away3D TypeScript」を使っています。 デモ ソースコード (TypeScript 1.0) このデモを通して紹介したいのは次の3つです。 色分解のロジック Flashライクで高機能なHTML5版BitmapDataクラスの紹介 Flash Stage3Dにフォールバック可能なAway3D TypeScriptのレンダラー 以下で、それぞれについて詳しく紹介します。 実装方法 このデモでは、img要素で画像を読み込み、それを色分解し、3D空間に表示しています。 1. 色分解のロジック Web上の多くの画像は赤・青

    HTML5で色分解した写真をWebGLで3D表示するAway3Dデモ - ICS MEDIA
    bapho
    bapho 2016/06/24
  • WebGLを極めるならJSライブラリを使わず書こう!モバイルでも動くHTML5の3次元スライドショーを作ってみた - ICS MEDIA

    WebGLを極めるならJSライブラリを使わず書こう!モバイルでも動くHTML5の3次元スライドショーを作ってみた 2014年9月にリリースされたiOS 8においてWebGLが動作するようになったことで、スマートフォン環境での3D表現に可能性を感じ、興味を持った方も多いと思います。そこで今回、写真を読み込んで3D空間上に配置し、パーティクルに分解して次の画像に切り替わるスライドーショーのデモをJSライブラリ(Three.jsなど)を使わずにイチからHTML5とWebGLで作ってみました。WebGLが動作する端末ならモバイルでもなめらかに動作するので、是非試してみてください。マウスやタッチの操作でビューを回転させることができます。 デモを再生する(別ウインドウが開きます) ソースコード (JavaScript) 制作環境について 今回のデモを作成するにあたり、WebGLのAPIを直接呼び出す形

    WebGLを極めるならJSライブラリを使わず書こう!モバイルでも動くHTML5の3次元スライドショーを作ってみた - ICS MEDIA
    bapho
    bapho 2016/06/24
  • SublimeText3を2年以上使って、生き残ったPluginを紹介します。 - Qiita

    $options['user_id'] = '1234'; $options['name'] = 'Ichiro Yamada'; $options['gender'] = 'male'; $options['age'] = '21'; どの記号で揃えるかは設定で増やせます。 このように列揃えすることで、他プログラマーへ処理のまとまりの単位を見せたり、タイプミスに気がつきます。 僕は、デフォルトそのままで使っていてイコールぐらいでしか使わないです。 ショートカットを覚えるほど利用頻度がないので、command + shift + pで、abacusと打って呼びます。 BracketHighlighter [], (), {}, "", '', <tag></tag>といったカッコ類を強調してくれます。 Pluginの説明ページに画像があるので、どんな機能なのかわかりやすいです。 https

    SublimeText3を2年以上使って、生き残ったPluginを紹介します。 - Qiita
  • JavaScriptでランダムの数(乱数)を作る方法

    2017/06/22 JavaScriptでランダムでメッセージや画像を表示したい場合に役立つ「乱数の作り方」を説明します。Mathオブジェクトのrandom()、floor()というメソッドを利用しましょう。 サンプルコード5〜10の間でランダムな整数を作る例です。 var min = 5 ; var max = 10 ; var a = Math.floor( Math.random() * (max + 1 - min) ) + min ;デモMath.random(n)で、0〜nまでのランダム数を取得できます。取得できる値は少数を含むので、整数を得たい場合はMath.floor()などで切り捨てましょう。 最大値を指定0〜10の間で得たい場合は11、0〜100で得たい場合は101を指定します。

    JavaScriptでランダムの数(乱数)を作る方法
  • あれ、いつも書いてるな~というJavaScript の小技集 | バシャログ。

    いい加減髪を切りたいminamiです。 JavaScriptでいつも書いてるな~という処理や、知っていると便利なTipsを簡潔に集めた記事を見てほお~と思ったものがいくつもあったので抜粋してみました。 ※追記1: ご指摘がありましたので一部修正しました。「配列をソートする」ではなく「配列をシャッフルする」でした。 ※追記2:「HTMLをエスケープする」のソースがまちがって表示されていました。修正しました。 ※追記3:予想以上に反響が大きく、多数ご指摘を受けてしまいました。よく使う処理の書き方もいろいろあるんだな~という参考程度にご紹介したのですが、参照元の記事の内容の検証が不十分なまま紹介してしまい申し訳ありませんでした。いろいろと勉強になりました! 45 Useful JavaScript Tips, Tricks and Best Practices 配列からランダムで値を取り出す v

    あれ、いつも書いてるな~というJavaScript の小技集 | バシャログ。
  • dat.GUI

    bapho
    bapho 2016/06/24