0

こんにちは、データベースから while ループを実行して多数の異なるレコードを表示しようとしていますが、レコードが表示される方法は異なる画像を使用しているため、標準の CSS を使用してカスタマイズすることはできず、インライン CSS を使用して実行していますが、私は各画像が正常に表示されるようになりましたが、ユーザーがホバーしても新しい画像は表示されません。関連する div の行は次のとおりです

<div id="house_wrapper" style="background-image: url(images/HOUSES/<?php print "$house_name";?>.png); :hover{background-image: url(images/HOUSES/<?php print "$house_name";?>_hover.png)};"></div><!---end house_wrapper--->

そして、これがwhileループ全体のコードです

    <div id="house_summary_content">

  <?php 
          $query = mysql_query("SELECT * FROM user_houses WHERE user_id='$user_id'");

          while($row = mysql_fetch_assoc($query)) : ?>
<?php extract($row);?>
<?php $sql_house = mysql_query("SELECT * FROM houses WHERE house_id='$house_id'");
$house_array = mysql_fetch_assoc($sql_house);
$house_name = $house_array['house_name'];?>
<div id="house_wrapper" style="background-image: url(images/HOUSES/<?php print "$house_name";?>.png); :hover{background-image: url(images/HOUSES/<?php print "$house_name";?>_hover.png)};"></div><!---end house_wrapper--->


 <?php endwhile ?>

</div><!---end house_summary_content--->

皆さんが与えることができるどんな助けにも感謝します

4

2 に答える 2

2

onmouseover と onmouseout で JavaScript を使用できますか? 例えば:

<div id="house_wrapper" style="background-image: url(http://i.imgur.com/F5iJY.jpg);width:100%;height:400px;" onmouseover="this.style.backgroundImage='url(http://i.imgur.com/YpJyG.jpg)';" onmouseout="this.style.backgroundImage='url(http://i.imgur.com/F5iJY.jpg)';"></div>​

デモ http://jsfiddle.net/UvPHp/9/

于 2012-06-04T17:40:08.617 に答える
0

これを試して:

HTML / PHP:

<div id="house_summary_content">
<?php 
    $query = mysql_query("SELECT * FROM user_houses WHERE user_id='$user_id'");

    while($row = mysql_fetch_assoc($query)) : ?>
<?php extract($row);?>
<?php $sql_house = mysql_query("SELECT * FROM houses WHERE house_id='$house_id'");
$house_array = mysql_fetch_assoc($sql_house);
$house_name = $house_array['house_name'];?>
<div id="house_wrapper" style="background-image: url('images/HOUSES/<?php print $house_name;?>.png')"></div><!---end house_wrapper--->

<?php endwhile ?>

</div><!---end house_summary_content--->

CSS:

<?php print $house_name; ?>:hover {
    background-image: url('images/HOUSES/<?php print "$house_name"; ?>_hover.png')
};

これは、画像のファイル名にスペースがない限り機能するはずです。

于 2012-06-06T05:49:44.050 に答える