ผู้อยู่ไหนช่วยกานหน่อย จะหัดส่ง javascript แต่ส่งเพื่อไปส่งให้ตารางมี background

เริ่มโดย nujum12345, 09 เมษายน 2009, 14:38:57

หัวข้อก่อนหน้า - หัวข้อถัดไป

0 สมาชิก และ 1 ผู้มาเยือน กำลังดูหัวข้อนี้

nujum12345

ตอนแรกหนูมีรูปให้ลิ้ง code :
<td width="88%" align="right">
<a href="javascript:BG('http://www.thaimuslim.com/blog/bgpage/Select/BGHit.jpg')">
<img src="http://www.thaimuslim.com/blog/bgpage/Select/BGHit.jpg" width="200" height="150" border="1" /></a></td>





แล้วก็ ส่งไปหา script :


<script language=JavaScript>
function BG(what)
{        <STYLE type=text/css>    
  #picture  Table{ background-image:url(http://www.thaimuslim.com/blog/bgpage/Select/BGHit.jpg);
            background-attachment:fixed;
        PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; }
             </STYLE>
} </script>


จากบรรทัก  "  #picture  Table{ background" เพื่อจะกำหนดว่าให้ไปที่ id="picture" และได้กำหนดตารางนึงว่า div id="picture"  แล้วพอคลิกรูปผ่านหน้าเว็บให้เลือกให้รูปนั้นเป็นพื้นหลังก็ไม่เปลี่ยน background ให้ และสถานะล่างซ้ายมือ ก็แจ้ง Error on page : :-X :-X :-X
ไม่แน่ใจว่า การใช้ <STYLE type=text/css>    จะใช้ร่วมกับ  <script language=JavaScript> ได้หรือไม่  แต่ก็เคยเห็นคนอื่นใช้กัน
[direct= *Link Removed* ]ข้อมูลดารา Update ใหม่ ๆ เป็นว่าเล่น [/direct]

itum


Kobsoft

 :-[ ลิงค์ที่ใช้ call ฟังก์่ชั่นผิดหลักไปนิดนึงนะคับ จิงๆ ใส่ event onclick ไปในแท็ก <img> เลยก็ได้ไม่จำเป็นต้องใช้แท็ก <a> เพราะว่าประหยัดโค้ดบวมบอทวิ่งง่ายดีด้วย

ส่วนฟังก์ชั่นในส่วนของ javascript มันใช้ไม่ได้นะคับ เกรงว่า จขกท. สับสนระหว่าง js กับ html นิดนึง การที่จะใช้ javascript เปลี่ยน style นั้นส่วนมากที่เห็นทำกันก็คือการระบุ style ให้กับ Object ID นั้นตรงๆ เลย ยกตัวอย่างง่ายๆ เช่น

function test1(ObjID, ClassName){
var Obj1 = document.getElementById(ObjID);
Obj1.className = ClassName;
}


ฟังก์ชั่นด้านบนมีการรับอากิวเมนต์เข้ามา 2 ตัว ตัวแรก ObjID คือชื่อไอดีของ Object ที่ต้องการส่วน ClassName คือชื่อคลาส ของ CSS ที่เราต้องการ

วิธีใช้ก็แค่เรียกฟังก์ชั่นผ่านแท็ก เช่น

<img src="" alt="" onclick="test1('td1', 'class1')" />

โดยที่ table1 คือชื่อไอดีของ object ที่ต้องการ และ class1 คือชื่อคลาสที่สร้างไว้ใน CSS

ตัวอย่างคลาสที่สร้างไว้

.class1{
... อยากได้ไรใส่ลงไปโลดดด
}



ก็มีประมาณนี้นะคับ สนใจเรียน xhtml, css2, js, ajax, asp, php, jsp, .net, java, Flash action script อื่นๆ มากมายในวงการเว็บ ผมรับสอนคับ ซิบสอบถามไ้ด้คับ  (อ้าว โคนาซะงั้น) คับผม


nujum12345

ขอบคุณมากเรยค่ะเพ๋  คือมันเป็นโค้ที่แบบว่าช่วยหนูได้อย่างสมบูรณ์ แบบที่เหลือก็จะต้องกำหนดว่าไม
<STYLE type=text/css>   
.class1 tabel{สั่งพื้นหลังสั่นสีพื้นหลัง}
</style>
ถึงเวลาที่ตั้งชื่อตาราง เป็น Id='ที่ระบุมากจากการ onclick' มันเปลี่ยนแต่ไม่เปลี่ยนทั้งพื้นหลังตาราง แต่เปลี่ยนเป็นบาง td เพราะใน td นั้นหนูได้แทรกตารางไว้อีกที แต่ไม่ได้ตั้งชื่อตาราง ไม่มี id ในตารางหลาย ๆ ตารางที่แทรกไว้ใน td ย่อยจาก table หลักที่มีรหัส
ถ้ายังไง พี่พอทราบก็ช่วยหนูอีกนิดน่ะค่ะ ขอบคุณมากค่ะ
[direct= *Link Removed* ]ข้อมูลดารา Update ใหม่ ๆ เป็นว่าเล่น [/direct]

Kobsoft

อ้างถึงจาก: nujum12345 ใน 09 เมษายน 2009, 17:08:58
ขอบคุณมากเรยค่ะเพ๋  คือมันเป็นโค้ที่แบบว่าช่วยหนูได้อย่างสมบูรณ์ แบบที่เหลือก็จะต้องกำหนดว่าไม
<STYLE type=text/css>   
.class1 tabel{สั่งพื้นหลังสั่นสีพื้นหลัง}
</style>
ถึงเวลาที่ตั้งชื่อตาราง เป็น Id='ที่ระบุมากจากการ onclick' มันเปลี่ยนแต่ไม่เปลี่ยนทั้งพื้นหลังตาราง แต่เปลี่ยนเป็นบาง td เพราะใน td นั้นหนูได้แทรกตารางไว้อีกที แต่ไม่ได้ตั้งชื่อตาราง ไม่มี id ในตารางหลาย ๆ ตารางที่แทรกไว้ใน td ย่อยจาก table หลักที่มีรหัส
ถ้ายังไง พี่พอทราบก็ช่วยหนูอีกนิดน่ะค่ะ ขอบคุณมากค่ะ


:-[  น้องคนเหนือป่ะเีนี่ย -*-

ผม อาจจะเข้าใจไม่หมดนะคับ ถ้าตกหรือพลาดตรงไหนไป ขออภัยด้วย

ในอากิวเมนต์ตัวแรกที่ระบุไปนั้น เราสามารถเลือก Object ID ได้อิสระ อย่างที่เข้าใจกันตามโครงสร้างของ <table> ว่าถ้าไม่มีการใส่ค่าพารามิเตอร์ เช่นสีพื้นหลังให้กับ <tr><th><td> ซึ่งเป็นแท็กลูก พวกแท็กเหล่านี้ก็จะใช้สีพื้นหลังของ <table> ไปโดยปริยาย (จิงๆ มันไม่ได้ใช้สีของ <table> หรอกเพียงแต่ว่ามันโปร่งใส แต่ในแง่ของ Output สายตาคนเรามองก็คือมองว่ามันใช้สีพื้นเหมือนกันกับ <table>)

เช่นกำหนด <table style="background-color:#FF0000;"> ก็จะทำให้เนื้อหาในแท็กด้านใน <tr><th><td> เป็นสีแดงไปด้วย เพราะฉะนั้น หากน้อง(หรือไม่น้องหว่า) ต้องการให้สีพื้นหลังของ <tr><th><td> ทุกอันเปลี่ยนไปพร้อมกันหลังทำ function ก็ให้ระบุค่า ID ที่็แท็ก <table> และไม่ต้องใส่ค่าพารามิเตอร์สีให้กับแท็ก <tr><th><td> แต่อย่างใด แต่หากถ้าไม่ต้องการให้ <td> ส่วนไหนเปลี่ยนสีไปตาม <table> ก็ให้ใส่ค่าพารามิเตอร์สีดักไว้ให้มันใช้สีพื้นหลังของตัวมันเอง

ตัวอย่าง

<table id="...">
  <tr><th></th></tr>
  <tr><td></td></tr>
</table>


แต่หากต้องการให้ <tr><th><td> อันใดอันหนึ่งเปลี่ยนสีเมื่อทำ function ก็ให้ระบุค่า ID ที่แท็กนั้นได้เลยตรงๆ

ตัวอย่าง

<table>
  <tr><th></th></tr>
  <tr><td id="..."></td></tr>
</table>


หรือในกรณีที่ด้านใน <td> น้องมีตารางซ้อนอยุ่และต้องการให้เปลี่ยนสีไปพร้อมกับ <table> นอก หรือ <td> ที่ครอบมันอยู่ ก็ไม่ต้องระบุพารามิเตอร์สีให้กับตารางด้านใน เพราะเราต้องการให้มันโปร่งใสและใช้สีพื้นร่วมกับ Ojbect ที่ครอบมันอยู่

ตัวอย่าง

<table>
  <tr>
    <th></th>
  </tr>
  <tr>
    <td id="...">
      <table><tr><td></td></tr></table>
    </td>
  </tr>
</table>


หรือในกรณีที่ด้านใน <td> น้องมีตารางซ้อนอยุ่และต้องการไม่ให้เปลี่ยนสีไปพร้อมกับ <table> นอก หรือ <td> ที่ครอบมันอยู่ ก็ระบุพารามิเตอร์สีให้กับตารางด้านใน

<table>
  <tr>
    <th></th>
  </tr>
  <tr>
    <td id="...">
      <table class="..."><tr><td></td></tr></table>
    </td>
  </tr>
</table>



หรือถ้ายังไม่เข้าใจก็มีหลักการง่ายๆ นะคับ ไม่ว่าจะเขียนโครงสร้างเว็บด้วย <table> หรือ <div> ถ้าเราไม่ได้ระบุค่าพารามิเตอร์สีพื้นหลังให้กับมัน มันก็จะโปร่งแสงและดูเหมือนใช้สีพื้นหลังเดียวกับ Object ที่ครอบมันอยู่ แต่ถ้ามีการระบุค่าพารามิเตอร์สีแยกให้กับมัน มันก็จะใช้สีของตัวมันเอง

ส่วนกรณีที่ว่าด้านใน <td> จะมี <table> ซ้อนกันอยู่สักกี่้ชั้นนั้น ไม่ต้องกังวลเท่าไรคับ ถ้าเข้าใจหลักการของโครงสร้างตามพารากราฟด้านบน ^

แต่เท่าที่ลองมา สำหรับ <table> นั้นมันไม่ค่อยเสถียรและ อิสระเท่ากับ <div> ปัญหาเนื่องมาจากโครงสร้าง <tr><th><td> ที่เป็นแท็กลูกของ <table> นั่นเอง

KRTINetwork

ลองดูครับ
ผมยังไม่ได้ลองเหมือนกันครับ  ;D


<script type="text/javascript">
function BG(what){
var table = document.getElementById('picture');
table.style.backgroundImage = 'url(' + what + ')';
table.style.backgroundAttachment = 'fixed';
table.style.padding = '0px';
table.style.margin = '0px';
}
</script>