Tolong pilih kategori sesuai, jenis posting (diskusi atau bukan) dan sertakan tag/topik yang sesuai seperti komputer, java, php, mysql, dll. Promosi atau posting tidak pada tempatnya akan kami hapus!
- Bagi Anda yang ingin mendaftar, baca link berikut:
http://diskusiweb.com/discussion/50491/how-to-registrasi-diskusiweb-com-baca-ini-terlebih-dahulu
- Cara menyisipkan kode program supaya tampil rapi dan terformat dengan baik di diskusiweb.com: http://www.diskusiweb.com/discussion/50415/cara-menyisipkan-kode-program-di-diskusiweb-com
- Cara posting gambar/image di post Anda: http://www.diskusiweb.com/discussion/47345/cara-menyisipkan-menyertakan-image-pada-posting/p1

[ASK] Membuat warna pada tabel selang seling dengan css di php

Selamat malam, mau tanya kepada para senior semua,

saya kan membuat array utk tabel ganjil dan genap dengan 2 pilihan warna.
ganjil warna: "#E8E8E8" (abu2 muda)
genap warna: "#fdfefe" (abu2 tua)

dengan code:
[code]
while ($baris = mysql_fetch_row($hasil))
 {
   $nomorurut++;
   if ($nomorurut % 2 == 0)
      $warna_belakang = "#E8E8E8";
   else
      $warna_belakang = "#fdfefe";

   $model = $baris[1];
   $quantity= $baris[3];
   $name= $baris[2];
  
   print("<tr bgcolor=\"$warna_belakang\" onMouseOver=\"this.className='sorot'\" onMouseOut=\"this.className='terang'\">\n");
   print("<td>$nomorurut</td>\n");
   print("<td>$model</td>\n");
   print("<td>$quantity</td>\n");
   print("<td>$name</td>\n");
   print("</tr>\n");
  
  }

[/code]


kemudian saat mouse diarahkan saya atur dengan css dengan pilihan warna:#E6B016
[code]
<style>
.tabeldata { border: 1px solid #909090; font-size : 16px }
.judul { font-weight: bold; text-align: center; background: #C0C0C0 }
.terang { background: #E8E8E8 }
.sorot { background: #E6B016 }
</style>

[/code]

[code]
print("<tr bgcolor=\"$warna_belakang\" onMouseOver=\"this.className='sorot'\" onMouseOut=\"this.className='terang'\">\n");
[/code]


nah problemnya, saat page diload warna ganjil genap sesuai tapi saat mouse onMouseOut warnanya saya tentukan menjadi abu2 muda, sesuai css (terang), soalnya klo saya set $warna_belakang malah setelah onMouseOut, warna backgroundnya jadi onMouseOver semua yakni "class sorot"

Mohon dibantu pencerahannya, baru belajar css soalnya.

ini full code nya :

[code]
<!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">
<head>
<style>
.tabeldata { border: 1px solid #909090; font-size : 16px }
.judul { font-weight: bold; text-align: center; background: #C0C0C0 }
.terang { background: #E8E8E8 }
.sorot { background: #E6B016 }
</style>
<title>Data Stok Butikalya</title>
</head>
<body>

<?php
 require_once "config.php";
 require_once "halaman.php";
 
 $per_halaman = 20;
 $halaman = new kelas_halaman($per_halaman);
 
 $id_mysql = mysql_connect(DB_HOSTNAME, DB_USERNAME, DB_PASSWORD);
 if (! $id_mysql)
  die ("gak bs konek ke server<br>\n");
 
 
 $db_butik = mysql_select_db ("butikaly_alyadb", $id_mysql);
 if (! $db_butik)
  die ("database butikalya tdk bisa dikonek<br>\n");
 
 $sql= "SELECT oc_product.product_id, oc_product.model, oc_product.quantity,  oc_product_description.name FROM oc_product,oc_product_description WHERE oc_product.product_id=oc_product_description.product_id AND oc_product_description.language_id='2' AND oc_product.quantity>'0' ORDER by oc_product_description.name ";

 $hasil = mysql_query($sql, $id_mysql);
 $jum_baris = mysql_num_rows($hasil);
 $halaman->tentukan_total_baris($jum_baris);
 $awal_record=$halaman->peroleh_awal_record();
 
 $sql= "SELECT oc_product.product_id, oc_product.model, oc_product.quantity,  oc_product_description.name FROM oc_product,oc_product_description WHERE oc_product.product_id=oc_product_description.product_id AND oc_product_description.language_id='2' AND oc_product.quantity>'0' ORDER by oc_product_description.name " .
       "LIMIT $awal_record, $per_halaman ";

 $hasil= mysql_query($sql, $id_mysql);
 $nomorurut = $awal_record;
 
 
 print("<table width =\"50%\" border=\"0\" cellspacing=\"1\" cellpadding=\"3\" class=\"tabeldata\">\n");
 print("<tr class=\"judul\">\n");
 print("<td width=\"5%\">No.</td>\n");
 print("<td width=\"10%\">KODE</td>\n");
 print("<td width=\"20%\">NAMA</td>\n");
 print("<td width=\"10%\">STOK</td>\n");
 print("</tr>\n");
 
 
 
 while ($baris = mysql_fetch_row($hasil))
 {
   $nomorurut++;
   if ($nomorurut % 2 == 0)
      $warna_belakang = "#E8E8E8";
   else
      $warna_belakang = "#fdfefe";

   $model = $baris[1];
   $quantity= $baris[3];
   $name= $baris[2];
  
   print("<tr bgcolor=\"$warna_belakang\" onMouseOver=\"this.className='sorot'\" onMouseOut=\"this.className='terang'\">\n");
   print("<td>$nomorurut</td>\n");
   print("<td>$model</td>\n");
   print("<td>$quantity</td>\n");
   print("<td>$name</td>\n");
   print("</tr>\n");
  
  }
 
 
 print("<table>\n");
 
 
 mysql_close($id_mysql);
 $halaman->tampilkan_link_halaman();
?>

</body>
</html>

[/code]


Terimakasih banyak.
Tagged:

Comments

  • edited June 2016
    onMouseOver=\"this.className='sorot'\"
    onMouseOut=\"this.className='terang'\"
    itu to ?

    saat cursor di atas baris, pake warna : #E6B016
    tapi saat keluar, pake warna : #E8E8E8

    sementara elo sendiri di awal bikin barisnya :
    $warna_belakang = "#E8E8E8"; //15263976
    $warna_belakang = "#FDFEFE"; //16645886

    antara #E8E8E8 dan #FDFEFE
    itu nilainya gede #FDFEFE
    15263976 < 16645886
    artinya #FDFEFE lebih terang dari #E8E8E8

    ganjil warna: "#E8E8E8" (abu2 muda) <~~ abu tua
    genap warna: "#FDFEFE" (abu2 tua) <~~ abu muda

    itu salah, lebih gelap / tua yg #E8E8E8

    liat aja sendiri mana yg lebih tua :
    http://www.colorpicker.com/E8E8E8
    http://www.colorpicker.com/FDFEFE



    trus ?
    pas disorot jadi kuning coklat
    pas keluar jadi abu tua
    ya bener, sesuai dgn koding yg elo tulis,
    koding elo ndak salah menampilkan, emang perintah yg elo tulis kaya begitu



    mbok cukup pake css aja to mas'e
    ndak perlu mouseover / mouseout

    .bground:hover { background: #E6B016 }

    print("<tr bgcolor=\"$warna_belakang\" class=\"bground\">\n");
  • wah terimakasih pak, jadi tercerahkan. soalnya bingung juga klo kombinasi array di table nya.


Sign In or Register to comment.