Tôi đã xem qua trang này. http. //photoshopworld. com/schedule/ trong đó khi nhấp vào tiêu đề của một lớp [in đậm], mô tả trong div sẽ hiển thị. Nếu nhấp lại, mô tả sẽ bị ẩn. Với javascript, điều này rất dễ thực hiện. Nhưng tôi không thấy bất kỳ chức năng javascript nào được gọi khi xem nguồn trang. Chức năng ẩn/hiển thị dường như chỉ được thực hiện bằng css. Có ai biết làm thế nào điều này được thực hiện?
Tháng Chín 7, 2011 lúc 3. 21 giờ tối
chrisburton
người tham gia
Điều gì về nút xuyên tâm mà Chris đã làm để chuyển đổi các tab?
Tháng Chín 8, 2011 lúc 1. 34 giờ chiều
tomz
Thành viên
Wolfcry & Paulie,
Bạn đúng là có rất nhiều javascript trên trang này. Tắt javascript bấm vào tiêu đề không hiện mô tả nữa. Có vẻ như javascript cung cấp tính năng này. Tuy nhiên, nếu bạn xem mã nguồn html như ví dụ bên dưới
Mở đăng ký hội thảo trước hội nghị
Hội thảo trước hội nghị tùy chọn
Phải là người tham dự Photoshop World đã đăng ký để tham gia. Yêu cầu đăng ký và lệ phí riêng biệt.
không có sự kiện javascript title nào được liên kết với tiêu đề “Đăng ký hội thảo trước hội nghị”. Đó là lý do tại sao ban đầu tôi nghĩ css cung cấp tính năng nhấp để hiển thị mô tả. Bạn có biết làm thế nào điều này được thực hiện?
Cảm ơn,
Tom
Tháng Chín 8, 2011 lúc 9. 47 giờ chiều
thomas
Thành viên
Bạn có thể làm điều gì đó tương tự bằng cách sử dụng. tiêu điểm
http. //jsfiddle. ròng/ce6Fe/
Nó sẽ không ẩn cho đến khi bạn nhấp chuột, nhưng nó hoạt động mà không cần JavaScript. Tất nhiên, các phần tử cấp khối không hợp lệ trong phần tử neo, trừ khi bạn đang sử dụng HTML 5
Mỗi phần tử HTML có một giá trị hiển thị mặc định tùy thuộc vào loại phần tử đó là gì. Giá trị hiển thị mặc định cho hầu hết các phần tử là block hoặc inline
Nhấp để hiển thị bảng điều khiển
Bảng điều khiển này chứa một
phần tử, được ẩn theo mặc định [
0]
Nó được tạo kiểu bằng CSS và chúng tôi sử dụng JavaScript để hiển thị nó [đổi nó thành [
1]
Phần tử cấp khối
Phần tử cấp khối luôn bắt đầu trên một dòng mới và chiếm toàn bộ chiều rộng có sẵn [kéo dài sang trái và phải hết mức có thể]
Các
phần tử là phần tử cấp khối
Ví dụ về các phần tử cấp khối
- -
Yếu tố nội tuyến
Phần tử nội tuyến không bắt đầu trên một dòng mới và chỉ chiếm nhiều chiều rộng khi cần thiết
Đây là phần tử nội tuyến bên trong một đoạn văn.
Ví dụ về các yếu tố nội tuyến
Trưng bày. không ai;
2 thường được sử dụng với JavaScript để ẩn và hiển thị các phần tử mà không xóa và tạo lại chúng. Hãy xem ví dụ cuối cùng của chúng tôi trên trang này nếu bạn muốn biết làm thế nào để đạt được điều này
Có nhiều cách để ẩn và hiện nội dung bằng một cú nhấp chuột [hoặc chạm hoặc chọc hoặc nhấn phím hoặc…]. Nhiều người trong số họ có JavaScript ẩn bên trong và gần như tất cả họ đều phụ thuộc vào thư viện và/hoặc CDN của bên thứ ba. Điều này có thể ổn khi bạn đã phải tải một đống tập lệnh trên một trang. Điều này cũng có thể dẫn đến thực tiễn phát triển kém
Bạn có thể giảm thiểu lỗi JavaScript đó bằng một chút cải tiến lũy tiến chỉ dành cho CSS. Nếu bạn dựa vào bộ chọn
3, bạn chỉ cần hai dòng CSS cho tính năng hiển thị/ẩn cơ bản nhất
.expando { display: none; } .expando:target { display: block; }Tôi đã làm một mẫu để hiển thị nó trong thực tế
Xem Pen Show/Hide Script-Free của Adrian Roselli [@aardrian] trên CodePen
Hỗ trợ các trình duyệt cũ hơn không biết phải làm gì với
3 có thể đơn giản như gói CSS trong truy vấn phương tiện hoặc sử dụng nhận xét có điều kiện [đối với Internet Explorer cũ]
Từ đây, bạn có thể tạo lớp cho tất cả các hiệu ứng hoạt hình JavaScript tiện lợi, các ràng buộc chính, v.v.
Điều gì đã thúc đẩy bài đăng này?
Tôi đã ở W3C để tìm kiếm tất cả các thông số kỹ thuật liên quan đến khả năng truy cập. Tôi đã xem danh sách các nhóm thông số kỹ thuật, thấy dòng chữ màu xanh nghĩa là tôi có thể nhấp vào [phần gạch dưới được áp dụng không nhất quán, vì vậy chúng không phải là đầu mối nhất quán] và điều gì đó sẽ xảy ra, nhưng không thể đi đến đâu
Một nguồn xem nhanh cho tôi thấy rằng đó không phải là liên kết cũng như nút [không có
5 và không có
6 nào được nhìn thấy]. Kiểm tra bảng điều khiển tôi thấy lỗi sau.
7
Tập lệnh không thành công và vì
5 được thêm sau khi trang được phân phát, nên lỗi đã ngăn không cho thêm bất kỳ điều khiển nào, khiến nội dung tôi muốn không có sẵn. HTML thô trông như thế này
Tôi đã chụp một ảnh chụp màn hình cho thấy [những gì tôi nghĩ] là tất cả các thông tin liên quan
Show My contentHideTôi có thiếu thứ gì không?
JJ; . 25 giờ chiều.đáp lại.
Chà, trình xác nhận không chùn bước. Vì vậy, có lẽ yeah?
Adrian Roselli; . 52 giờ chiều.đáp lại.
Đây là những gì tôi đã cố gắng thể hiện
https. // codepen. io/j8j8/bút/rNOoMbR
CodePen hơi rắc rối với thuộc tính href trống, nhưng href trống hợp lệ trong HTML5 và điều này có vẻ hoạt động khác
Chủ Đề