目前分類:JQ (19)

瀏覽方式: 標題列表 簡短摘要

$("#btn1").bind('click',function(){
    //       
})

$("#btn1").trigger("click");

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

用AJAX送出表單後,會希望將欄位裡面的值全部清空

$("form[name='pressForm']").find(":text,textarea,input").each(function() {
          $(this).val("");
      });

$(":input").attr("checked",false);

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

/*  get the image height */
function heightItem(){
  $("div.gallery .image img").load(function(){
  var height = $(this).height();
  alert(height);

, , , ,

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

/*判斷是否為手持裝置*/
function is_mobile() {
        var mobiles = new Array("midp", "j2me", "avant", "docomo", "novarra",
                "palmos", "palmsource", "240x320", "opwv", "chtml", "pda",
                "windows ce", "mmp/", "blackberry", "mib/", "symbian", "wireless",

,

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

<script type="text/javascript" src="./js/jquery-1.8.0.js"></script>
<script type="text/javascript" defer>
$(function() {
   $.ajax({
                url : "js/jquery.tinyscrollbar.min.js",

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

基本的網頁傳值,以前都換頁用POST/GET居多
但是使用此方法,需要轉頁
通常都會利用一個隱藏的input表單 偷偷利用js來做傳值的動作
程式如下:

<form action='./admin/edit_feature' method='post' id='product_list'>

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

使用前要先下載並引入:jquery.cookie.js
https://github.com/carhartl/jquery-cookie
 

//設定 example 為 foo
$.cookie("example", "foo");

//設定 example 為 foo 且存活7天
$.cookie("example", "foo", { expires: 7 });

, , ,

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

 

head裡面填入

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript">

function SetCwinHeight() {

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

<script type="text/javascript" src="http://j.maxmind.com/app/geoip.js"></script>
<script>
(function() {
/*確認使用者是否第一次進入本網頁*/
var ilona = checkCookie();

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

範例下載:

http://www.designchemical.com/lab/jquery-mega-drop-down-menu-plugin/examples/#

http://djdesignerlab.com/2011/07/08/16-jquery-menus-with-beautiful-animations-for-developers/

http://www.dynamicwp.net/articles-and-tutorials/15-really-amazing-jquery-navigation-menu/

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

一定要先hide(),才能設定fadeIn()顯示出來

<script type="text/javascript">
(function($) {
jQuery(document).ready(function($) {
  $('body').hide();

, ,

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

可利用雙引號拆開</script>,讓script可以正常運作。

<script type="text/javascript">
 (function($) {
  jQuery(document).ready(function($) {
            var code = "<script>alert('Hi!');</scr"+"ipt>";
            $('body ac').before(code);
  });
 })();
</script>

 

若裡面有方法,也是要利用引號拆解

前後script標籤各自獨立,中間的方法不用再用引號隔開,用加號連結及可。

var code = "<Script>"+setTimeout("location.href='http://www.google.com'",0);    +"</Sc"+"ript> ";
            $('body ac').before(code);

參考連結:http://stackoverflow.com/questions/610995/jquery-cant-append-script-element

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

可以利用此來抓取使用者的ip位置

<script type="text/javascript">
    $(function(){        
        //印出IP
        $.getJSON("http://jsonip.appspot.com?callback=?",
                function(data){
                   alert( "Your ip: " + data.ip);
        }); 
    });
</script>

 

 

 

 

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

這次介紹的Scrolling Parallax jQuery Plugin

主要是用在可以把背景div,在捲動卷軸時,可以有不一樣的速度

達到視差滾動的效果(Parallax scrolling

 

說了這麼多,先來看範例最快吧:

, ,

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

Smooth scrolling demo

<script src="smoothscroll.js" type="text/javascript"></script>

<a href='#tag1'>click</a>
<a name='tag1'>title name</a>

 

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript" src="jquery.backgroundPosition.fixed.js"></script>

 

<style type="text/css">
div {

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

<!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" />

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

<!DOCTYPE html>
<html>
<title></title>
<head>
<script type="text/javascript" src="jquery-1.7.1.js"></script>

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()

<!DOCTYPE html>
<html>
<title></title>
<head>
<script type="text/javascript" src="jquery-1.7.1.js"></script>

cabuchi 發表在 痞客邦 PIXNET 留言(0) 人氣()