jQueryでの可変対応について教えて下さい
今､添付画像のようなｺﾒﾝﾄｴﾘｱ付きのｻﾑﾈｲﾙ一覧を作っています｡
ｿｰｽは以下です｡
< li class="span4 prd-box">
< img src="common/images/sample_img.jpg" alt="sample_img" class="">
< div class="detail">
< p class="date">13.11.29< /p>
< p class="comment hidden-phone">ここにｺﾒﾝﾄが入ります｡< /p>
< /div>
< /li>
ｸﾗｽ名【detail】で黒い帯の部分を制御しています｡
このｻｲﾄはﾚｽﾎﾟﾝｼﾌﾞになっており､可変するのですが､可変させると黒い帯の幅がずれてしまいます｡
更新すればもちろん直りますが､ﾘｱﾙﾀｲﾑに追従してくれません｡
jQueryで幅の取得は出来ますが､それをﾘｱﾙﾀｲﾑな可変に対応させらせません｡
CSSでもJSでもなにかよい方法があればｱﾄﾞﾊﾞｲｽを頂きたいです｡
よろしくお願いします｡
CSSでは対応難しそうですかね｡jQueryのresizeｲﾍﾞﾝﾄを拾って書き換える､というのもいいかもしれないですね｡
$(window).on('resize',function(){
$('.detail').width($('.prd-box img').width());
});
.resize() | jQuery API Documentation
動作確認は一切していません｡
ﾍﾞｽﾄｱﾝｻｰ