如何從這個網站

我想實現類似的網頁的標題呈現給本網站使用jQuery的用戶的方式的東西，也就是實現這個標題生成您單擊主索引中的縮略圖，該縮略圖的標題會生成不同的值，直到它正確顯示給用戶。如何從這個網站

想知道這是否可以用jQuery實現，即使它使用Adobe Flash？

謝謝。

2009-10-19 tonyf

這是一個沒有jQuery的方法。我相信這可以得到改善，但我希望這可以幫助你，並告訴你如何做到這一點。

<html> 
<head> 
<script type="text/javascript"> 

function createRandomString(length, id, callback, value) { 
    if (typeof value == "undefined"){ 
     value = ""; 
    } 
    if (value.length == length){   
     callback(value); 
     return; 
    } 
    var c = ((Math.round(Math.random() * 100)) % 127); 
    if (c == '\'' || c == '\"'){ 
     c = 33; 
    } 
    value += String.fromCharCode(Math.max(33, c)); 
    document.getElementById(id).innerHTML = value; 
    setTimeout(function(){createRandomString(length, id, callback, value)}, 20); 
} 

    function changeHeader(id, realString, randomString){ 
     if (typeof randomString == "undefined") { 
     createRandomString(realString.length, id, function(value){changeHeader(id, realString, value);}); 
     return; 
     } 
     var d = realString.length - randomString.length; 
     var modifiedString = realString.substring(0, d) + randomString; 
     document.getElementById(id).innerHTML = modifiedString; 
     if (randomString.length == 0){ 
     return; 
     } 
     randomString = randomString.substring(1); 
     setTimeout(function(){changeHeader(id,realString,randomString);}, 50); 
    } 


</script> 
</head> 
<body> 

<h1 id="test"></h1> 

<button onclick="changeHeader('test', 'this is the header')">Test</button> 
</body> 
</html>

來源

2009-10-19 14:03:48 moxn

感謝堆Moxn - 作品非常棒。將通過您的代碼來了解您的方法。 – tonyf 2009-10-20 00:28:32

沒問題。不客氣 – moxn 2009-10-20 08:26:50

雖然moxn已經做了所有的辛勤工作爲你，我想你是真正之後就是一個jQuery的田間版本...

所以這裏是一個jQuery插件，感謝moxn爲原代碼，我所做的就是將其轉換爲一個jQuery插件

(function($){ 
    $.fn.generateHeader=function(settings){ 
    var settings=$.extend({ 
     newText:"This is a new header" 
    },settings); 
    return this.each(function(){ 
     var _this=$(this)[0]; 

     changeHeader(_this, settings.newText); 

     function createRandomString(length, node, callback, value) { 
     if (typeof value == "undefined"){ 
      value = ""; 
     } 
     if (value.length == length){     
      callback(value); 
      return; 
     } 
     var c = ((Math.round(Math.random() * 100)) % 127); 
     if (c == '\'' || c == '\"'){ 
      c = 33; 
     } 
     value += String.fromCharCode(Math.max(33, c)); 
     node.innerHTML = value; 
     setTimeout(function(){createRandomString(length, node, callback, value)}, 20); 
     } 

    function changeHeader(node, realString, randomString){ 
     if (typeof randomString == "undefined") { 
     createRandomString(realString.length, node, function(value){changeHeader(node, realString, value);}); 
     return; 
     } 
     var d = realString.length - randomString.length; 
     var modifiedString = realString.substring(0, d) + randomString; 
     node.innerHTML = modifiedString; 
     if (randomString.length == 0){ 
     return; 
     } 
     randomString = randomString.substring(1); 
     setTimeout(function(){changeHeader(node,realString,randomString);}, 50); 
    } 




    }); 
    }; 
})(jQuery);

你會首先包括上述代碼的某個地方在HTML使用它...

，然後調用類似$('#heading').generateHeader({newText:'this is the new header text'});其中heading是您希望將其應用於此元素的元素的ID，然後將'this is the new header text'更改爲任何您想要顯示的文本...

來源

2009-10-19 19:18:15 ekhaled

感謝ekhaled for jQuerying Moxn的版本。 – tonyf 2009-10-20 00:29:25

如何從這個網站

回答

相關問題