mnk375 @ ウィキ http://w.atwiki.jp/mnk375/ mnk375 @ ウィキ ja 2012-06-03T16:07:12+09:00 1338707232 クロスブラウザ注意点 https://w.atwiki.jp/mnk375/pages/51.html クロスブラウザのためのテクニック集 http://coliss.com/articles/build-websites/operation/work/1234.html IE6バグ解決法 http://coliss.com/articles/build-websites/operation/css/1036.html jQuery総集編 http://coliss.com/articles/build-websites/operation/javascript/100-jquery-plugins-2011-best.html 2012-06-03T16:07:12+09:00 1338707232 dl　表組　ネガティブマージン編 https://w.atwiki.jp/mnk375/pages/50.html 無印　サマーキャンプ 開催日／場所部分、dl表組　ネガティブマージン http://www.mujioutdoor.net/school/kids_summer_camp/2012/concept.html <dl> <dt>第1回</dt> <dd>7月23日　キャンプ場</dd> <dt>第1回</dt> <dd>7月23日　キャンプ場</dd> <dt>第1回</dt> <dd>7月23日　キャンプ場</dd> </dl> -------------------------------------- dl { margin:0; padding:0; line-height:1.4; font-size:12pt; } dt { line-height:1.5em; margin:0px; padding:0px; } dd { line-height:1.5em; margin-top:-1.5em; padding:0 0 7px 4em; } -------------------------------------- 行間と同じ数値のネガティブマージンを記載するそう。（IE6も対応） DWのデザインビューには反映されないとのこと http://www.nk0206.com/life/2010/04/dt-dd-n-margin.html [CSS]ネガティブマージンの理解を深め、活用するテクニック集 http://coliss.com/articles/build-websites/operation/css/css-using-negative-margins.html 2012-06-02T14:57:40+09:00 1338616660 jQuery pLUGIN https://w.atwiki.jp/mnk375/pages/49.html http://plugins.jquery.com/ https://github.com/jquery/plugins.jquery.com http://jquerylist.com/ 西畑一馬氏のサイト http://javascript.webcreativepark.net/ http://www.delicious.com/stacks/view/QZQpDa http://b.hatena.ne.jp/search/tag?q=jQuery http://coliss.com/articles/build-websites/operation/javascript/100-jquery-plugins-2011-best.html 2012-05-26T14:18:21+09:00 1338009501 Ajax de スムーズページング https://w.atwiki.jp/mnk375/pages/48.html http://go.ascii.jp/?jq13 -------------------------------------------------------------------- フロント側html -------------------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample1</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("#content").load($("ul.pager li a:first").attr("href")+" #content"); $("ul.pager li a:first").addClass("selected"); $("ul.pager li a").click(function(){ $("#content").html('<p class="loading"><img sr 2012-05-25T23:40:43+09:00 1337956843 カルーセルパネル　自動スライド https://w.atwiki.jp/mnk375/pages/47.html http://go.ascii.jp/?jq12/sample2.html --------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample2</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("#carouselInner").css("width",620*$("#carouselInner ul.column").size()+"px"); $("#carouselInner ul.column:last").prependTo("#carouselInner"); $("#carouselInner").css("margin-left","-620px"); $("#carouselPrev").click(function(){ $("#carouselNext,#carouselPrev").hide(); $("#caro 2012-05-25T14:04:44+09:00 1337922284 カルーセルパネル https://w.atwiki.jp/mnk375/pages/46.html http://go.ascii.jp/?jq12 --------------------------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample1</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("#carouselInner").css("width",620*$("#carouselInner ul.column").size()+"px"); $("#carouselInner ul.column:last").prependTo("#carouselInner"); $("#carouselInner").css("margin-left","-620px"); $("#carouselPrev").click(function(){ $("#carouselNext,#carouselPrev").hide(); $( 2012-05-25T14:02:50+09:00 1337922170 drag&drop可能！フローティングウィンドウ　IE6対応版 https://w.atwiki.jp/mnk375/pages/45.html http://editors.ascii.jp/m-kobashigawa/jqsample/chapter03/10/sample2.html ------------------------------------------------------------------------ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample2</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("a.open").click(function(){ $("#floatWindow").fadeIn("fast"); return false; }); $("#floatWindow a.close").click(function(){ $("#floatWindow").fadeOut("fast"); return false; }); $("#floatWindow dl dt").mousedown(functio 2012-05-25T11:43:42+09:00 1337913822 テキストモーダルウィンドウ https://w.atwiki.jp/mnk375/pages/44.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample5</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("dd").hide() $("body").append("<div id='glayLayer'></div><div id='overLayer'></div>"); $("#glayLayer").click(function(){ $(this).hide(); $("#overLayer").hide(); }); $("dt").click(function(){ $("#glayLayer").show(); $("#overLayer").show().html("<img src='images/close.png' class='close' />"+$("+dd",this).html()).css({ marginTop:"-"+$("#overL 2012-05-24T15:35:33+09:00 1337841333 lightbox風モーダルウィンドウ IE向け処理 setExpression https://w.atwiki.jp/mnk375/pages/43.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample3</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("body").append("<div id='glayLayer'></div><div id='overLayer'></div>"); $("#glayLayer").click(function(){ $(this).hide(); $("#overLayer").hide(); }); $("a.modal").click(function(){ $("#glayLayer").show(); $("#overLayer").show().html("<img src='"+$(this).attr("href")+"' />"); return false; }); if($.browser.msie && $.browser.version< 2012-05-24T15:34:54+09:00 1337841294 lightbox風モーダルウィンドウ https://w.atwiki.jp/mnk375/pages/42.html http://editors.ascii.jp/m-kobashigawa/jqsample/chapter03/09/sample2.html ----------------------------------------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>sample2</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $("body").append("<div id='glayLayer'></div><div id='overLayer'></div>"); $("#glayLayer").click(function(){ $(this).hide() $("#overLayer").hide(); }); $("a.modal").click(function(){ $("#gla 2012-05-24T15:45:08+09:00 1337841908