อยากให้เวลาคลิกลิงค์ไหน ให้มีพื้นหลังแสดงด้วย เค้าทำกันยังไงหรอครับ (มีตัวอย่าง)

fogza · 05 เมษายน 2012, 19:55:21

http://www.basic-skill.com/content.php?cont_title=:link%20%E0%B9%81%E0%B8%A5%E0%B8%B0%20:visited&cont_id=284&sec_id=10
คือเวลาคลิกเมนูด้านบนเสร็จ จะเปลี่ยนหน้าแล้วลิงค์ที่ถูกคลิกก็จะมีพื้นหลังสีขาวปรากฏ เค้าทำกันยังไงเอ่ย
ผู้รู้ช่วยแนะนำทีครับ
คำถามอาจจะดูงงๆ นะครับ

jim_no1 · 05 เมษายน 2012, 20:15:55

ไม่เข้าใจคำถามน่ะ

fogza · 05 เมษายน 2012, 20:18:44

อ้างถึงจาก: jim_no1 ใน 05 เมษายน 2012, 20:15:55
ไม่เข้าใจคำถามน่ะ

ตามเว็บตัวอย่างนะครับ เวลาคลิกเมนูด้านบน เมนูไหนที่ถูกคลิก จะมีพื้นหลังสีขาวนะครับ พอจะเข้าใจไหมเอ่ย

iLhay · 05 เมษายน 2012, 20:21:45

http://www.w3schools.com/css/css_pseudo_classes.asp

ก็มีบอกหมดนะคับ ="=

a:link {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */

fogza · 05 เมษายน 2012, 20:47:45

อ้างถึงจาก: iLhay ใน 05 เมษายน 2012, 20:21:45
http://www.w3schools.com/css/css_pseudo_classes.asp

ก็มีบอกหมดนะคับ ="=

a:link {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */

ผมลองแล้วไม่ได้นะครับ ถ้า :visited นี้จะเป็นลิงค์ที่ถูกคลิกไปแล้ว :link ก็ลิงค์ที่ยังไม่ถูกคลิก มันไม่มีที่คลิกลิงค์ปัจจุบันนะครับ หรือว่าผมเขียนโค้ดไม่ถูกเอง

มีตัวอย่างไหมครับ รบกวนทีนะครับ

ningnongkup · 05 เมษายน 2012, 22:14:23

อ้างถึงจาก: fogza ใน 05 เมษายน 2012, 20:47:45
อ้างถึงจาก: iLhay ใน 05 เมษายน 2012, 20:21:45
http://www.w3schools.com/css/css_pseudo_classes.asp

ก็มีบอกหมดนะคับ ="=

a:link {color:#FF0000;} /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;} /* mouse over link */
a:active {color:#0000FF;} /* selected link */
ผมลองแล้วไม่ได้นะครับ ถ้า :visited นี้จะเป็นลิงค์ที่ถูกคลิกไปแล้ว :link ก็ลิงค์ที่ยังไม่ถูกคลิก มันไม่มีที่คลิกลิงค์ปัจจุบันนะครับ หรือว่าผมเขียนโค้ดไม่ถูกเอง
มีตัวอย่างไหมครับ รบกวนทีนะครับ

ไม่ค่อยเข้าใจคำถาม แต่น่าจะตัวนี้

nociouz · 05 เมษายน 2012, 22:20:12

แบบนั้น มันเป็นที่ ตีมครับ
มันหมายถึง หน้ามั้งครับ ไม่ใช่ลิงค์

ผมมั่ว

siamseo · 05 เมษายน 2012, 22:26:33

ผม งง

หนุ่มบ้านโคก · 05 เมษายน 2012, 22:31:33

เค้าคงหมายถึงแถบเมนูด้านบนอะครับ ที่มันเปลี่ยนเป็นสีขาวเวลาเราอยู่ในหน้านั้น
ลองไปดู css ครับ

คนธรรมดา · 05 เมษายน 2012, 22:38:46

ถูกมั้ย

โค้ด เลือก


<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
	background-color: #000000;
}
a:link {
	color: #FFFFFF;
}
a:visited {
	color: #FFFFFF;
}
a:hover {
	color: #FF0000;
	background-color:#FFCC00;
}
a:active {
	color: #FF0000;
	background-color:#FFCC00;
}
-->
</style></head>

<body>
<a href="#">TEXT</a> | <a href="#">TEXT</a> | <a href="#">TEXT</a>
</body>
</html>

animationz · 05 เมษายน 2012, 22:59:57

a:active {
color: #FF0000;
background-color:#FFCC00;

อันนี้แหละครับ อิอิ

fogza · 05 เมษายน 2012, 23:35:21

อ้างถึงจาก: animationz ใน 05 เมษายน 2012, 22:59:57
a:active {
color: #FF0000;
background-color:#FFCC00;

อันนี้แหละครับ อิอิ

มันขึ้นมาแปปเดียวนะครับ ผมอยากให้มันค้างอยู่ เหมือนเมนูด้านบนของเว็บตัวอย่างนะครับ
ผมอธิบายงงๆ ก็ขอโทษด้วยครับ

iLhay · 05 เมษายน 2012, 23:40:57

ใช้ a:active แล้วเปลี่ยน background คับ

และก้ใช้ a:hover เปลี่ยนสีตัวอักษร

fogza · 05 เมษายน 2012, 23:46:13

อ้างถึงจาก: iLhay ใน 05 เมษายน 2012, 23:40:57
ใช้ a:active แล้วเปลี่ยน background คับ

และก้ใช้ a:hover เปลี่ยนสีตัวอักษร

ทำตามที่บอกแล้ว แต่เวลาเลื่อนเมาส์ออกจากลิงค์ พื้นหลังมันก็หายไปนะครับ

iLhay · 05 เมษายน 2012, 23:47:20

ใส่แต่ a:hover ก็หายครับ ถ้าใส่ a:active ไม่หาย

fogza · 06 เมษายน 2012, 00:15:34

อ้างถึงจาก: iLhay ใน 05 เมษายน 2012, 23:47:20
ใส่แต่ a:hover ก็หายครับ ถ้าใส่ a:active ไม่หาย

iLhay · 06 เมษายน 2012, 01:43:27

อาการแบบนี้ CSS ทับกันคับ

fogza · 06 เมษายน 2012, 02:46:55

อ้างถึงจาก: iLhay ใน 06 เมษายน 2012, 01:43:27
อาการแบบนี้ CSS ทับกันคับ

โทษทีครับ ลืมอัพเดทลิงค์
http://jsfiddle.net/KGFGv/14/

yoyokung · 06 เมษายน 2012, 02:51:57

ชอบคุณ fogza ตั้งคำถาม ชวนตอบมากๆ และกระจายความรู้สุดๆ

ว่าแต่ทำได้หรือยังครับ

iLhay · 06 เมษายน 2012, 02:56:27

อ้างถึงจาก: fogza ใน 06 เมษายน 2012, 02:46:55
อ้างถึงจาก: iLhay ใน 06 เมษายน 2012, 01:43:27
อาการแบบนี้ CSS ทับกันคับ
โทษทีครับ ลืมอัพเดทลิงค์
http://jsfiddle.net/KGFGv/14/

ลองเช็คดูครับ ทำไม a:hover ถึงเปลี่ยนเป็นสีเข้มๆ แล้วทำไม a:active ถึงไม่เป็น

เท่าที่ผมเคยทำมา และถ้าละรึกไม่ผิด เป็นอาการของ CSS ทับกันคับ