code báo đen chạy ở chân trang

Để làm con báo hay bất cứ con nào chạy bạn phải có sprite - dịch khung hình cho dễ nhớ của nó gợi ý nên tìm Gif -> convert online thành sprite -> psd -> png xong ta có 1 sprite của con gì đó

B1 Để add báo vào Đầu tiên là css

Script con ruồi fshare

Gần đây fshare ra mắt script ruồi độc đáo làm ko ít người ngạc nhiên , ruồi các điểm nổi bật sau :

 -Ruồi bò  lung tung trên website, với số lượng max là 3 con ruồi

code đếm ngược - countdown kiểu flipclock

code đếm ngược - countdown kiểu flipclock - code thích hợp đếm ngược đến sự kiện nào đó

toàn bộ code đơn giản mà đẹp

zeroclipbroad auto copy to clipbroad

Thao tác nhanh với 1 cú click chuột để copy - tiện lợi cho người sử dụng kèm theo tương thích với mọi trình duyệt là ưu điểm của script dùng file flash zeroclipbroad . do dùng flash cho nên  zeroclipbroad phải dùng host mới chạy được .

sử dụng

hiệu ứng pháo hoa javascript

Năm mới sắp đến thêm chút hiệu ứng pháo hoa trên blog/website cho  nó thêm hào hứng - chỉ là 1 đoạn javascript hay bạn có thể lưu vào file riêng để chạy

Cách 1 
dùng nhúng file javascript  
<script type='text/javascript' src='http://webvn20.googlecode.com/files/phoahoa.js'></script> 

Tạo Thanh toolbox cho website

Thanh toolbox viết hoàn toàn bằng javascript tương thích hầu hết trình duyệt hỗ trợ javascript  thông thường toolbox được đặt bên phải sát thanh scrollbar hỗ trợ ngưới sử dụng thao tác dễ dàng với website.

các nút chức năng chính của toolbox gồm:
-di chuyển lên đầu trang
-quay trở lại trang trước
-nút liên hệ
-refresh trang web
-di chuyển cuối trang
-tự động  chuyển động từ từ đến cuối trang (+1)

- nút dừng chuyển động

Chống xung Đột các thư viện jquery và javascript

Cách dùng chung jQuery với các thư viện javascript khác

Khi ứng dụng web của bạn dùng  thư viện jQuery chung với các thư viện javascript khác như Prototype. Dùng nhiều trong cách tạo menu ,slideshow và các hiệu ứng ảnh ,sự xung đột sẽ xảy ra do 2 thư viện này đều dùng hàm $(). Sự tranh giành sẽ dẫn đến kết quả  chỉ cho 1 thư viện chạy thôi còn thằng kia không hoạt động.

Để khắc phục việc này, bạn sử dụng phương thức jQuery.noConflict().bằng cách định nghĩa lại hàm

Cách giải nén javascript - Unpack PACKED scripts

1 vài website khi chia sẻ 1  đoạn script  do họ tự viết hay lấy ở đâu đó đã bị biến thành khó đọc,tuy nhiên người sử dụng khi dùng những đoạn mã này có thể được giải thích về tác dụng chính của nó , nhưng tác dụng phụ của nó thì thật khó lường . Với javascript ta có thể chèn bất cứ cái gì kể cả trang chứa virut nếu người chia sẻ cố ý đồ xấu .....  
Che giấu javascript là 1 cách bảo vệ khỏi bị người khác chôm chỉa khi bị view source và khi muốn dùng riêng cho bản thân mình , đây là cách để  thêm 1 tầng để bảo vệ mã .,nhất là khi dùng với ajax , che giấu hay mã hóa sẽ giảm thiểu nguy cơ bị hacker tấn công .
Ngoài  cách mã hóa thông thường còn có vài  kiểu nữa là   compiler code của google   
  và sử dụng  Packer  chủ yếu để làm cho mã javascript trở nên khó đọc hơn làm mất time  cũng như nản lòng hacker khi tấn công.

ví dụ với script đơn giản như

Script Tạo mã qrcode sử dụng api google

Cách tạo khá đơn giản là dùng google api để xử lý dữ liệu và trả về kết quả trên trang chủ
xem Demo

 Các Bước Làm

Hiệu ứng Tuyết rơi javascript

Cơn bão tuyết  là một hiệu ứng viết bằng  JavaScript có thể dễ dàng thêm vào các trang web. Dễ sử dụng, và dễ dàng để thiết lập.

chỉ sử dụng 1 file javascript duy nhất , có đầy đủ các chức năng cần thiết.  đặc biệt không  sử dụng  hình ảnh cho các hiệu ứng tuyết. tăng khả năng load .

Đưa bloc Lịch âm dương theo ngày hiện tại lên web

Bài trước có giới thiệu về lịch âm dương nhưng theo tháng khi click vào ngày nào thì hiện các thông tin âm lịch của ngày đó , bây h muốn trình bày lịch âm dương theo kiểu lịch bloc truyên thống ( lịch tờ ) như hình sau:

Để chèn thêm lịch vào ta thêm những đoạn code sau vào trong trang web

Hiển thị câu danh ngôn ngẫu nhiên bằng javascript

---

F5 trang này để xem demo :

---

Ta sẽ thấy trước khi refresh .

 và sau khi refresh

Để hiển thị ngẫu nhiên 1 câu danh ngôn  hay là 1 đoạn Text bất kỳ, bạn có thể sử dụng đoạn mã javascript đơn giản sau :

Tự thay đổi ảnh nền của website theo thời gian bằng javascript

script đơn giản làm thay đổi ảnh nền của website

<script type="text/javascript">

var now = new Date();
var hours = now.getHours();
if(hours >0 && hours < 8){
document.write ('<body style="background:url(anh 1.jpg) #174c98 no-repeat fixed center top;">');

}
else if (hours > 8 && hours < 16){
document.write ('<body style="background:url(anh 2.jpg) #174c98 no-repeat fixed center top;">');
}
else {
document.write ('<body style="background:url(anh 3.jpg) #174c98 no-repeat fixed center top;">');
}

</script>

  thay đổi đường dẫn ảnh tương ứng vào anh 1, anh 2  anh 3...

chèn quảng cáo chạy 2 bên sát màn hình áp dụng với blogspot

chèn đoạn code này vào trước thẻ html </body> của bất kỳ trang nào kể cả blogspot

<div id="divAdRight" style="left:914px; width: 90px; position: absolute; z-index:99; top: 5px;" align="center">
 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZZLLuBIxU8ZUULe06ZdXpzvt-Ml3vN_DWm0ujbkwdhos5bwZhGxUFsunVmdwbYdVFH2K18M8vOnBYNsAUpZch8rL2eS2LnWAcK8VFXsu0NFPwMELc9XB_qKs8InAUYBumnIwOBi_KC2ce/s1600/welcome_page_map.png" height="257" width="90" /> </div>
<div id="divAdLeft" style="left:3px; width:90px; position:absolute; z-index:99; top:5px;" align="center">
 <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZZLLuBIxU8ZUULe06ZdXpzvt-Ml3vN_DWm0ujbkwdhos5bwZhGxUFsunVmdwbYdVFH2K18M8vOnBYNsAUpZch8rL2eS2LnWAcK8VFXsu0NFPwMELc9XB_qKs8InAUYBumnIwOBi_KC2ce/s1600/welcome_page_map.png" height="257" width="90" /> </div>


lấy thông tin thời tiết bằng Javascript

Thông tin về thời tiết là một trong những widget hay được hiển thị nhất trên các website tin tức. Tuy vậy, có nhiều web master không biết cách làm widget này. Tôi thường thấy người ta "mượn tạm" các file javascript hoặc lọc nội dung trên các website nổi tiếng như VnExpress, Dân trí, ... rồi hiện chúng trên website của mình. Cách làm như vậy khiến website của mình phụ thuộc vào các trang đó, đồng thời cũng khó tùy biến.

Bài viết này sẽ chia sẻ cho các bạn cách lấy thông tin dự báo thời tiết và hiển thị chúng trên website 1 cách đơn giản. Thông tin thời tiết này được lấy từ Yahoo! nên có thể đảm bảo độ chính xác và tin cậy.

Cách hiển thị thông tin thời tiết trên website

Để hiển thị thông tin thời tiết trên website, bạn chỉ cần chèn đoạn code sau vào trong thẻ head:

<script type="text/javascript" src="http://rilwis.googlecode.com/svn/trunk/weather.min.js"></script>

Sau đó, ở vị trí bạn muốn hiển thị thông tin thời tiết, bạn chỉ cần chèn đoạn code:

<script type="text/javascript">
showWeather('hanoi, vietnam');
</script>

tạo đếm ngược thời gian với javascript count down javascript

tạo đếm ngược thời gian với javascript count down javascript
<form name="counter"><input type="text" size="8"
name="d2"></form>

<script>
<!--
//
var milisec=0
var seconds=30
document.counter.d2.value='30'

function display(){
if (milisec<=0){
milisec=9
seconds-=1
}
if (seconds<=-1){
milisec=0
seconds+=1
}
else
milisec-=1
document.counter.d2.value=seconds+"."+milisec
setTimeout("display()",100)
}
display()
-->
</script>

tạo nút thẻ a

<html>
<body>
<script>
var links=document.createElement('a');
links.setAttribute("href","http://www.yahoo.com");
links.textContent="yahoo";
document.body.appendChild(links);

var newdiv = document.createElement('div');
newdiv.setAttribute("id","moot450");
newdiv.setAttribute("style", "position:absolute; border:2px solid #000000; width:300px; height:300px;");
document.body.appendChild(newdiv);


</script>
</body>
</html>

chuyen anh theo thoi gian

<code>
// Created by: Lee Underwood :: http://javascript.internet.com/
var t;
var bannerImg = new Array();
// Enter the names of the images below
bannerImg[0]="1.jpg";
bannerImg[1]="2.jpg";
bannerImg[2]="3.jpg";

var linkimg = new Array();

linkimg[0]="http://dantri.com.vn";
linkimg[1]="http://vtc.vn";
linkimg[2]="http://saovn.com";
var newBanner = 0
var totalBan = bannerImg.length

function cycleBan() {
newBanner++
if (newBanner == totalBan) {
newBanner = 0
}
document.banner.src=bannerImg[newBanner]
document.getElementById('linkchuyen').href=linkimg[newBanner]
t=setTimeout("cycleBan()", 2*1000)
}
function stop(){
clearTimeout(t);
}

window.onload=cycleBan;


a img{
border:3px solid #f2f2f2;
margin:2px;
}

<a href="#" name="linkchuyen" id="linkchuyen">
<img src="1.jpg" width="300px" height="200px">
</a>
</code>

chuyen link va anh javascript


// Created by: Lee Underwood :: http://javascript.internet.com/
var t;
var bannerImg = new Array();
// Enter the names of the images below
bannerImg[0]="1.jpg";
bannerImg[1]="2.jpg";
bannerImg[2]="3.jpg";

var linkimg = new Array();

linkimg[0]="http://dantri.com.vn";
linkimg[1]="http://vtc.vn";
linkimg[2]="http://saovn.com";
var newBanner = 0
var totalBan = bannerImg.length

function cycleBan() {
newBanner++
if (newBanner == totalBan) {
newBanner = 0
}
document.banner.src=bannerImg[newBanner]
document.getElementById('linkchuyen').href=linkimg[newBanner]
t=setTimeout("cycleBan()", 2*1000)
}
function stop(){
clearTimeout(t);
}

window.onload=cycleBan;


a img{
border:3px solid #f2f2f2;
margin:2px;
}






xoay hình trong css javascript

css
/* for firefox, safari, chrome, etc. */
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
/* for ie */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
script

Image Rotate








var ImageArr1 = new Array("Picture(3).jpg","Picture(1).jpg","Picture(2).jpg");
var ImageHolder1 = document.getElementById('Rotating1');

var ImageArr2 = new Array("Picture(5).jpg","Picture(6).jpg","Picture(7).jpg");
var ImageHolder2 = document.getElementById('Rotating2');

function RotateImages(whichHolder,Start)
{
var a = eval("ImageArr"+whichHolder);
var b = eval("ImageHolder"+whichHolder);
if(Start>=a.length)
Start=0;
b.src = a[Start];
window.setTimeout("RotateImages("+whichHolder+","+(Start+1)+")",1500);
}

RotateImages(1,0);
RotateImages(2,0);