• Tư vấn điều trị
      bệnh khàn tiếng


    www.trikhantieng.com

    Liên hệ + 0913163316

BlogList111

Việt Nam Gia Phả, nơi lưu trữ Gia Phả của người Việt Nam  Kiến thức Blogspot Ngonluanho: Nhung cau chuyen thap lua-Tin-Cay-Men Vngreenzone Là một nơi chia sẻ kinh nghiệm làm blogger - Nơi tôn vinh tâm hồn blogger Việt

Hiển thị danh ngôn ngẫu nhiên sử dụng JavaScript

1
14/10/2010

Khi thiết kế website hoặc webblog, đôi khi chúng ta cần hiển thị một chuỗi câu trích dẫn hay chuỗi câu danh ngôn nổi tiếng theo kiểu ngẫu nhiên để tạo sự nổi bật cho trang web. Trong trường hợp này có thể sử dụng ngôn ngữ JavaScript khá đơn giản để có được kết quả mong muốn.

Xem DEMO

Cấu trúc HTML cho website có dạng như sau:


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Hiển thị danh ngôn ngẫu nhiên</title>
<meta content="Huynh Nhat Ha" name="author" />
</head>
<body>

<div> >>>Đối với Blogger dùng từ dòng này
<p id="quoteWrapper"></p>
</div>


<script type="text/javascript">

var Quotes =
{
getRandomQuote: function()
{
var quote = [];
quote[0] = "When you have given nothing, ask for nothing.";
quote[1] = "Good habits result from resisting temptation.";
quote[2] = "If you bow at all, bow low.";
quote[3] = "Examine what is said, not him who speaks.";
quote[4] = "Make your bargain before beginning to plow.";
quote[5] = "Don't make use of another's mouth unless it has been lent to you.";
quote[6] = "Seize opportunity by the beard, for it is bald behind.";
quote[7] = "Be not afraid of growing slowly, be afraid only of standing still.";
quote[8] = "Do not employ handsome servants.";
quote[9] = "Do not remove a fly from your friend's forehead with a hatchet.";

var maxLength = quote.length;
var position = Math.floor(Math.random() * maxLength);
return Quotes.displayQuote("quoteWrapper", quote[position]);
},
displayQuote: function(ctl, quote)
{
ctl = document.getElementById(ctl);
ctl.innerHTML = quote;
}
};

Quotes.getRandomQuote();

</script> >>>Đối với Blogger kết thúc tại dòng này</body>
</html>

Chúng ta có thể thay đổi câu danh ngôn hay trích dẫn tùy ý, có thể tăng số lượng hiển thị ngẫu nhiên lên 10, 11, 12, ... n,...

Đối với Blogger, bạn chỉ cần dán đoạn code giữa 2 phần đánh dấu màu đỏ vào một tiện ích (widget) tại nơi bạn muốn hiển thị trên blog của bạn là xong.

Sau đây là một cách khác cũng khá giống với cách trên.

Chèn đoạn code dưới đây trước thẻ </head>.

<script language="JavaScript">

function rotateEvery(sec)
{
var Quotation=new Array()

// QUOTATIONS
Quotation[0] = 'First quotation';
Quotation[1] = 'Second quotation';
Quotation[2] = 'Third quotation';
Quotation[3] = 'Fourth quotation';
Quotation[4] = 'Fifth quotation';
Quotation[5] = 'Sixth quotation';
Quotation[6] = 'You can add as many quotations as you like';

var which = Math.round(Math.random()*(Quotation.length - 1));
document.getElementById('textrotator').innerHTML = Quotation[which];

setTimeout('rotateEvery('+sec+')', sec*1000);
}
</script>

Lưu ý bạn phải thay các quotation bằng câu danh ngôn bạn lựa chọn để hiển thị.
Thay thế thẻ <body> bằng thẻ: <body onload="rotateEvery(1)">.
Sau đó chèn đoạn code dưới đây vào vị trí bạn muốn hiển thị trên web hay blog của bạn.

<div id="textrotator"><!--Quotations will be displayed here--></div>
Chúc bạn thành công!

{1 bình luậnAdd yours ?}

11:14:00, 7 thg 4, 2011

cảm ơn bạn nhiều nhé. Thế giới Sim VIP http://simvip.co.cc

Reply
Nội quy! Đóng lại Khi bạn viết bình luận, cần tuân thủ một số quy tắc sau:
» Bình luận phải nghiêm túc và không chứa các liên kết quảng cáo.
» Có thể sử dụng các thẻ <b> … </b>,<i> … </i>, <a href="URL..."> ... </a>.
» Yêu cầu thủ thuật tại mục Yêu cầu thủ thuật hoặc hỏi tại mục Hỏi và Đáp.
More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa

Next post: Bài đăng Mới hơn

Previous post: Bài đăng Cũ hơn