皆さんもご存知だと思います。
Lightbox_meプラグインを僕も最近使いました。
使っていて気付いたことがあります。
Overlay要素がcloseしても消えないでdisplay:none状態で残っています。
使い方が悪いのか、仕様なのか、
Ajaxで取得した以下のようなhtmlをLightbox_meするとOverlayがdisplay:noneにならずに残ってしまい、クリックなどができなくなってしまう問題が発生しました。
■やりたいこと
フォームのプレビュー画面を出したい。
Lightbox_meしているボタンをクリックすると以下のAjax通信が始まって
読み込んで来たHTMLをさらにLightbox_meするという操作で。
しかし、キャンセル(close)すると問題がおきる。
操作が効かなくなるんです。
$.get('preview', {}, function(res){
$(res).lightbox_me();
});
resには以下のようななHTMLソースコードが入ってます。
------Ajaxで読み込んで来た要素------
<div id="preview">
....
</div>
---------------------------------------------
デベロッパーコンソールで見てみるとOverlay要素がのこっていました。
しかもそれがdisplay:noneになっていなかった。
どうやら、Lightbox_meはOverlayをhide()するようです。
destroyOnCloseオプションを使えば消えるけど、表示内容まで消しちゃうから再利用できない。
Lightbox_meのソースコードを見てみるとOverlayはhide()するか表示要素と一緒に消す
ことしかできないことがわかったから。
ちょっと書き換えてみました。
125行目をコメントアウトしてOverlayを消すようにしました。
※オプションにした方が使いやすそう...
//$self.add($overlay).hide();
$self.hide();
$overlay.remove();
もし使い方が間違ってたならご指摘をお願いいたします。
2012年11月18日日曜日
Lightbox_meでOverlayが残ってしまう
ラベル:
java,
javascript,
jQuery,
lightbox,
Lightbox_me,
overlay,
script,
ライトボックス,
消す,
問題
2012年10月12日金曜日
Mountain LionでXcodeのCommand Line Toolsをインストール
MacPortsをインストールしてもXcodeでCommand Line Toolsをインストールしないと
portコマンドが機能しません。
Command Line Toolsインストールの手順は以下の通り。
Xcodeインストール→Xcode起動→環境設定→Downloads→Command Line Toolsを選択→インストールクリック
これでめでたくportコマンドが使えるようになりました。
以上です。
portコマンドが機能しません。
Command Line Toolsインストールの手順は以下の通り。
Xcodeインストール→Xcode起動→環境設定→Downloads→Command Line Toolsを選択→インストールクリック
これでめでたくportコマンドが使えるようになりました。
以上です。
2012年7月7日土曜日
ロリポップサーバにmagentoをインストールする
ECサイトを作ってみたくてロリポップを契約した。
インストールには以下のサイトがすごく役に立ちました。
「参考サイト」http://ameblo.jp/go2park4kids/entry-11031177903.html
大まかには上記のサイトで書かれている手順でいいですが、
日本語化という点においては手順を変えます。
ロリポップにmagentoをインストール後にmagentoコネクト経由で
日本語ファイルをインストールしようとしたら、503エラーページが
表示されて以降magentoにアクセスできなくなりましたorz
そこで日本語化を踏まえて以下のようにインストール手順を変えました。
1、公式サイトからcommunity editionをダウンロードし解凍します。
2、次に日本語化用のファイルをダウンロードします。今回使ったのはgitHubに上がっているrack990の翻訳ファイルです。ダウンロードします。
3、2でダウンロードしたファイルを解凍するとjp_JPディレクトリがあるのでそれを1で解凍したmagento/app/locale/に入れます。デフォルトでen_ENが入っていることろです。
4、インストール後に管理画面で一部アクセスできなくなるのを防ぐために先に修正をします。このサイトを参考に適切にcacheディレクトリを指定します。
5、ここまで準備ができたらFTPクライアントでロリポップサーバにファイルを全てアップロードします。詳しくは参考サイトを見て下さい。
6、アップロード後のインストール作業は参考サイトをよく読んで行って下さい。
7、インストールが終わればおkです。私の場合は.htaccessファイルがアップロードされずに以下のような問題が発生しました。
【発生した問題】
「お使いのサーバは正しく設定されていません。そのため設定ファイルの機密情報が外部からアクセスされてしまいます。サーバ管理者にご連絡ください。」
インストールには以下のサイトがすごく役に立ちました。
「参考サイト」http://ameblo.jp/go2park4kids/entry-11031177903.html
大まかには上記のサイトで書かれている手順でいいですが、
日本語化という点においては手順を変えます。
ロリポップにmagentoをインストール後にmagentoコネクト経由で
日本語ファイルをインストールしようとしたら、503エラーページが
表示されて以降magentoにアクセスできなくなりましたorz
そこで日本語化を踏まえて以下のようにインストール手順を変えました。
1、公式サイトからcommunity editionをダウンロードし解凍します。
2、次に日本語化用のファイルをダウンロードします。今回使ったのはgitHubに上がっているrack990の翻訳ファイルです。ダウンロードします。
3、2でダウンロードしたファイルを解凍するとjp_JPディレクトリがあるのでそれを1で解凍したmagento/app/locale/に入れます。デフォルトでen_ENが入っていることろです。
4、インストール後に管理画面で一部アクセスできなくなるのを防ぐために先に修正をします。このサイトを参考に適切にcacheディレクトリを指定します。
5、ここまで準備ができたらFTPクライアントでロリポップサーバにファイルを全てアップロードします。詳しくは参考サイトを見て下さい。
6、アップロード後のインストール作業は参考サイトをよく読んで行って下さい。
7、インストールが終わればおkです。私の場合は.htaccessファイルがアップロードされずに以下のような問題が発生しました。
【発生した問題】
「お使いのサーバは正しく設定されていません。そのため設定ファイルの機密情報が外部からアクセスされてしまいます。サーバ管理者にご連絡ください。」
上記のメッセージがインストール後に表示されました。
いろいろ調べると既にMagento-JPで質問されており原因は.htaccessがなくて機密ファイルへアクセスできる状態とのことでした。
対策としては.htaccessファイルを追加してやればおkです。
できればFTPアップロードするときに一緒に上げておきたいですね。
これでようやく無事にインストールできました+:。ヾ(o・ω・)ノ゜.+
2012年7月6日金曜日
Javaでオレオレ証明書のサーバに対してhttpsアクセス
テストでローカルのオレオレ署名のサーバにhttpsアクセスしたいのでウェブでサンプルを探したけど、非推奨パッケージを使っているものが多くて大変でした。
ようやく動いたのがあるのでメモしておく。
以下のソースを参考にしてください。
参照元はここです。
適当なimportを行なって下さい。
private void initHttps(){
try
{
mClient = new DefaultHttpClient();
final SSLContext sslContext = SSLContext.getInstance("SSL");
sslContext.init(null, new TrustManager[] { new X509TrustManager() {
public void checkClientTrusted(X509Certificate[] arg0,
String arg1) throws CertificateException {
}
public void checkServerTrusted(X509Certificate[] arg0,
String arg1) throws CertificateException {
}
public X509Certificate[] getAcceptedIssuers() {
return new X509Certificate[0];
}
} }, null);
final SSLSocketFactory factory = new SSLSocketFactory(sslContext,
new AllowAllHostnameVerifier());
final Scheme https = new Scheme("https", 443, factory);
final SchemeRegistry schemeRegistry = mClient
.getConnectionManager().getSchemeRegistry();
schemeRegistry.register(https);
}
catch (Exception e)
{
}
}
ようやく動いたのがあるのでメモしておく。
以下のソースを参考にしてください。
参照元はここです。
適当なimportを行なって下さい。
private void initHttps(){
try
{
mClient = new DefaultHttpClient();
final SSLContext sslContext = SSLContext.getInstance("SSL");
sslContext.init(null, new TrustManager[] { new X509TrustManager() {
public void checkClientTrusted(X509Certificate[] arg0,
String arg1) throws CertificateException {
}
public void checkServerTrusted(X509Certificate[] arg0,
String arg1) throws CertificateException {
}
public X509Certificate[] getAcceptedIssuers() {
return new X509Certificate[0];
}
} }, null);
final SSLSocketFactory factory = new SSLSocketFactory(sslContext,
new AllowAllHostnameVerifier());
final Scheme https = new Scheme("https", 443, factory);
final SchemeRegistry schemeRegistry = mClient
.getConnectionManager().getSchemeRegistry();
schemeRegistry.register(https);
}
catch (Exception e)
{
}
}
2012年6月15日金曜日
Java1.7とJava1.5を共存させる
理由があってJDKの異なるバージョンを共存させなければいけなくなって、
調べて解決したのでメモ。
■求める用件は以下の通り
・EclipseはJava1.7で動かしたい
・別のソフトはJava1.5で動かしたい(正確には動かさないといけなかった)
■解決方法
1、システム環境変数にJAVA_HOMEをJava1.5で設定し、PATHに追加
2、Eclipse.iniの設定ファイルに-vm項目を追加してJava1.7を設定
-vm
C:\...\...\...\Java\...\javaw.exe
これでEclipseはJava1.7で起動し、ほかのJavaソフトはJava1.5で起動する
■もうひとつのマニュアル操作的方法
1、同じくシステム環境変数にJAVA_HOMEをJava1.5を設定し、PATHに追加
2、ユーザ環境変数にJAVA_HOMEをJava1.7で設定する
これでOK。
Java1.5を使いたい場合は、上記の設定で。
Java1.7を使いたい場合は、システム環境変数のJAVA_HOMEをJAVA_HOME2とかにしちゃう
そうするとPATHの中のJAVA_HOMEはユーザ環境変数のJAVA_HOMEになるから
Java1.7が使えるという方法
取り急ぎメモ。
調べて解決したのでメモ。
■求める用件は以下の通り
・EclipseはJava1.7で動かしたい
・別のソフトはJava1.5で動かしたい(正確には動かさないといけなかった)
■解決方法
1、システム環境変数にJAVA_HOMEをJava1.5で設定し、PATHに追加
2、Eclipse.iniの設定ファイルに-vm項目を追加してJava1.7を設定
-vm
C:\...\...\...\Java\...\javaw.exe
これでEclipseはJava1.7で起動し、ほかのJavaソフトはJava1.5で起動する
■もうひとつのマニュアル操作的方法
1、同じくシステム環境変数にJAVA_HOMEをJava1.5を設定し、PATHに追加
2、ユーザ環境変数にJAVA_HOMEをJava1.7で設定する
これでOK。
Java1.5を使いたい場合は、上記の設定で。
Java1.7を使いたい場合は、システム環境変数のJAVA_HOMEをJAVA_HOME2とかにしちゃう
そうするとPATHの中のJAVA_HOMEはユーザ環境変数のJAVA_HOMEになるから
Java1.7が使えるという方法
取り急ぎメモ。
2012年6月12日火曜日
AndroidのToggleButtonをiPhoneのスイッチ風に本気でカスタマイズする(XML編)
カスタマイズした結果は以前示した通りです。
かなりiPhoneに近くなりました。
実際に用いたXMLを以下に示す。
ON・OFFの画像は私の作品ではないので著作権の問題を考慮し、
公開しません。ご自分で用意してください。
なにかツッコミ、質問がありましたらよろしくお願いします。
--------------以下XML----------------
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false"><layer-list>
<item><shape>
<size android:height="27dp" android:width="80dp" />
<corners android:radius="25dp" />
<solid android:color="#dcdcdc" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:bottom="1.5dp" android:left="5dp" android:right="8dp" android:top="13dp"><shape>
<corners android:radius="15dp" />
<gradient android:angle="270" android:centerColor="#ededed" android:centerX="0.5" android:centerY="0.5" android:endColor="#ededed" android:gradientRadius="10" android:startColor="#ededed" android:type="linear" />
</shape></item>
<item android:right="52dp"><shape>
<size android:height="27dp" android:width="28dp" />
<corners android:radius="25dp" />
<solid android:color="#ffffff" />
<gradient android:angle="270" android:centerColor="#dcdcdf" android:centerX="0.5" android:centerY="0.3" android:endColor="#ffffff" android:gradientRadius="10" android:startColor="#dcdcdc" android:type="linear" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:left="27dp"><bitmap android:gravity="center" android:src="@drawable/off" />
</item>
</layer-list></item>
<item android:state_checked="true"><layer-list>
<item><shape>
<size android:height="27dp" android:width="80dp" />
<corners android:radius="25dp" />
<solid android:color="#0099ff" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:bottom="1.5dp" android:left="8dp" android:right="5dp" android:top="13dp"><shape>
<corners android:radius="15dp" />
<gradient android:angle="270" android:centerColor="#33aaff" android:centerX="0.5" android:centerY="0.5" android:endColor="#33aaff" android:gradientRadius="10" android:startColor="#33aaff" android:type="linear" />
</shape></item>
<item android:left="52dp"><shape>
<size android:height="27dp" android:width="28dp" />
<solid android:color="#ffffff" />
<gradient android:angle="270" android:centerColor="#dcdcdf" android:centerX="0.5" android:centerY="0.3" android:endColor="#ffffff" android:gradientRadius="10" android:startColor="#dcdcdc" android:type="linear" />
<corners android:radius="25dp" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:right="27dp"><bitmap android:gravity="center" android:src="@drawable/on" />
</item>
</layer-list></item>
</selector>
かなりiPhoneに近くなりました。
実際に用いたXMLを以下に示す。
ON・OFFの画像は私の作品ではないので著作権の問題を考慮し、
公開しません。ご自分で用意してください。
なにかツッコミ、質問がありましたらよろしくお願いします。
--------------以下XML----------------
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false"><layer-list>
<item><shape>
<size android:height="27dp" android:width="80dp" />
<corners android:radius="25dp" />
<solid android:color="#dcdcdc" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:bottom="1.5dp" android:left="5dp" android:right="8dp" android:top="13dp"><shape>
<corners android:radius="15dp" />
<gradient android:angle="270" android:centerColor="#ededed" android:centerX="0.5" android:centerY="0.5" android:endColor="#ededed" android:gradientRadius="10" android:startColor="#ededed" android:type="linear" />
</shape></item>
<item android:right="52dp"><shape>
<size android:height="27dp" android:width="28dp" />
<corners android:radius="25dp" />
<solid android:color="#ffffff" />
<gradient android:angle="270" android:centerColor="#dcdcdf" android:centerX="0.5" android:centerY="0.3" android:endColor="#ffffff" android:gradientRadius="10" android:startColor="#dcdcdc" android:type="linear" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:left="27dp"><bitmap android:gravity="center" android:src="@drawable/off" />
</item>
</layer-list></item>
<item android:state_checked="true"><layer-list>
<item><shape>
<size android:height="27dp" android:width="80dp" />
<corners android:radius="25dp" />
<solid android:color="#0099ff" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:bottom="1.5dp" android:left="8dp" android:right="5dp" android:top="13dp"><shape>
<corners android:radius="15dp" />
<gradient android:angle="270" android:centerColor="#33aaff" android:centerX="0.5" android:centerY="0.5" android:endColor="#33aaff" android:gradientRadius="10" android:startColor="#33aaff" android:type="linear" />
</shape></item>
<item android:left="52dp"><shape>
<size android:height="27dp" android:width="28dp" />
<solid android:color="#ffffff" />
<gradient android:angle="270" android:centerColor="#dcdcdf" android:centerX="0.5" android:centerY="0.3" android:endColor="#ffffff" android:gradientRadius="10" android:startColor="#dcdcdc" android:type="linear" />
<corners android:radius="25dp" />
<stroke android:width="1dip" android:color="#808080" />
</shape></item>
<item android:right="27dp"><bitmap android:gravity="center" android:src="@drawable/on" />
</item>
</layer-list></item>
</selector>
2012年6月8日金曜日
AndroidのToggleButtonをiPhone風に本気でカスタマイズする(XMLは次回)
登録:
投稿 (Atom)
