長い間透過 PNG の処理が、単純に文字だけの場合にのみ使えるというようなおまけの処理でしたが、いろいろと対応しました。 透過時の透過部分表示透過の効果を明確にする為に、画像の親要素の DIV の背景に灰色のチェックのパターンを表示しています。 透過時にドロップシャドウ
いままでドロップシャドウは、内部で作成した背景をぼかして使用していました。もちろん、背景透過でなければなにも問題は無いのですが、文字だけをぼかしてそのまた後ろに背景を作成する事ができないので、背景透過の場合は文字側で、透過度の違う黒文字をずらして重ねた影を使ってドロップシャドウを使えるようにしました。 この文字でのドロップシャドウは斜めに少しづつ透過度の違う文字を重ねて使用しているので、ぼかした場合よりもシャープになります。ですが、全く無いよりもはるかに見栄えがするようになります。 また、現時点では影の濃さは一種類ですので、Shadow チェックボックスの左端のみに反応するようになっています。 透過時に背景画像とドロップシャドウ
今まで、背景画像を使ってドロップシャドウを使用した場合は背景画像もぼけてしまいました。
しかし今回の更新で、背景画像を使ってドロップシャドウも使いたい場合は、透過PNG 処理を行えば目的を達成する事ができるようになりました。 そして、このサンプルでは、全面に画像を使用していますが、透過 PNG を背景画像にしてその PNG の透過部分を有効にする事もできます。
背景画像にふきだし画像を追加
もっと多くのふきだし画像を追加する予定ですが、もともとこのふきだしの中に文字を入れるという事が目的での整備でした。このような処理を、DUAL・横・縦・はんこ(はんこにはドロップシャドウはありません)で可能になっています。 ▼ DUAL
▼ 横
▼ 縦
▼ はんこ
![]()
|
|
【フリーフォントで簡単ロゴ作成の最新記事】
書体見本ページ フリーフォントのライセンス情報![]()

透過の効果を明確にする為に、画像の親要素の DIV の背景に灰色のチェックのパターンを表示しています。
透過時にドロップシャドウ


しかし今回の更新で、背景画像を使ってドロップシャドウも使いたい場合は、透過PNG 処理を行えば目的を達成する事ができるようになりました。
そして、このサンプルでは、全面に画像を使用していますが、透過 PNG を背景画像にしてその PNG の透過部分を有効にする事もできます。

もっと多くのふきだし画像を追加する予定ですが、もともとこのふきだしの中に文字を入れるという事が目的での整備でした。このような処理を、DUAL・横・縦・はんこ(はんこにはドロップシャドウはありません)で可能になっています。
▼ DUAL







今回、主に背景に設定しやすい 最大サイズ 800 x 400 の画像を 12 枚用意しました。『通常画像(背面チェックボックスを ON)』の欄にある画像は、選択すると『画像を背面で表示する』チェックボックスが ON になります。( URL の w=780 の部分を変更すると幅を指定できますが、800 以内の表示状態であれば、自動的に幅は設定されます )
この機能で作成したサンプルは以下のようになります。(ランダムで表示されたものをフォントサイズ調整して縦幅調整したものです)












一度選択した地域は、localStorage に保存するので、次回からは選択した地域が最初が表示されています。
URL だけ解っていても、リンクとして存在しないと右クリックしてダウンロードできない場合、これを使用するとその場でリンクを作成します。また、同時にその URL を使用した HTML もコピーして利用できるようにします。













この画像は、オリジナルで 5760×3840 ですが、Google の Picasa で URL 縮小して 600px で表示しています。それに対してリアルタイムで『フリーフォントで簡単ロゴ作成』で加工したのがこれ。


※ デュアルページで再現

現在(2014/11/14)メインページのみですが、表示された画像サイズ内でマウスでドラッグして部分的に画像をダウンロードする事ができます。
最初に、ダウンロードボタンの右にある『範囲指定』をクリックしてチェックをオンにした後、画像内部でドラッグして下さい。
すると、上のようなコントロールが表示され、ドラッグして位置を移動したり、サイズを自由に変更できます。
位置やサイズが決まったら、ダウンロードボタンでダウンロードします。
処理が終わったら、チェックをオフにして元の状態に戻せますが、続けて範囲指定したい場合はそのまま続けて処理できます。ただし、この処理中に内容を変更しても表示に反映されないので、内容を変更したい場合はチェックをオフにして下さい








































