邵珠庆の日记 生命只有一次，你可以用它来做很多伟大的事情–Make the world a little better and easier


271月/13关

《Head First 设计模式》代码之PHP版

发布在 邵珠庆

《Head First 设计模式》是本不错的讲解设计模式的书，不像F4写的那么枯燥，应该算是比较容易理解的好书。书中的例子都比较浅显易懂，不过由于是外国佬写的，所以例子的习惯不是很附合中国特色，可能偶尔看起来有些别扭，还有语言习惯也不是中国风。当然看过这本书之后，你才能深刻理解设计模式到底能为你解决哪些题，不能为你解决哪些问题（比如不能代替你的编码）。

策略模式

 

[php] view plaincopy

 
  1. <?php  
  2. /** 
  3.  * 策略模式 
  4.  * 定义了算法族，分别封装起来，让它们之间可以互相替换， 
  5.  * 此模式让算法的变化独立于使用算法的客户。 
  6.  */  
  7. //飞行行为接口  
  8. interface FlyBehavior {  
  9.     public function fly();  
  10. }  
  11. //呱呱叫行为接口  
  12. interface QuackBehavior {  
  13.     public function quack();  
  14. }  
  15. //翅膀飞行  
  16. class FlyWithWings implements FlyBehavior {  
  17.     public function fly() {  
  18.         echo "I'm flying!!/n";  
  19.     }  
  20. }  
  21. //不会飞  
  22. class FlyNoWay implements FlyBehavior {  
  23.     public function fly() {  
  24.         echo "I can't fly!/n";  
  25.     }  
  26. }  
  27. class FlyRocketPowered implements FlyBehavior {  
  28.     public function fly() {  
  29.         echo "I'm flying with a rocket!/n";  
  30.     }  
  31. }  
  32. class Qquack implements QuackBehavior {  
  33.     public function quack() {  
  34.         echo "Quack/n";  
  35.     }  
  36. }  
  37. class Squeak implements QuackBehavior {  
  38.     public function quack() {  
  39.         echo "Squeak/n";  
  40.     }  
  41. }  
  42. class MuteQuack implements QuackBehavior {  
  43.     public function quack() {  
  44.         echo "<< Silence >>/n";  
  45.     }  
  46. }  
  47. abstract class Duck {  
  48.     protected $quack_obj;  
  49.     protected $fly_obj;  
  50.     public abstract function display();  
  51.     public function performQuack() {  
  52.         $this->quack_obj->quack();  
  53.     }  
  54.     public function performFly() {  
  55.         $this->fly_obj->fly();  
  56.     }  
  57.     public function swim() {  
  58.         echo "All ducks float, even decoys!/n";  
  59.     }  
  60.     public function setFlyBehavior(FlyBehavior $fb) {  
  61.         $this->fly_obj = $fb;  
  62.     }  
  63.     public function setQuackBehavior(QuackBehavior $qb) {  
  64.         $this->quack_obj = $qb;  
  65.     }  
  66. }  
  67. class ModelDuck extends Duck {  
  68.     public function __construct() {  
  69.         $this->fly_obj = new FlyNoWay();  
  70.         $this->quack_obj = new MuteQuack();  
  71.     }  
  72.     public function display() {  
  73.         echo "I'm a model duck!/n";  
  74.     }  
  75. }  
  76. $model = new ModelDuck();  
  77. $model->performFly();  
  78. $model->performQuack();  
  79. //提供新的能力  
  80. $model->setFlyBehavior(new FlyRocketPowered());  
  81. $model->setQuackBehavior(new Squeak());  
  82. $model->performFly();  
  83. $model->performQuack();  
  84. ?>  

 

单件模式

 

[php] view plaincopy

 
  1. <?php  
  2. /** 
  3.  * 单件模式 
  4.  * 确保一个类只有一个实例，并提供一个全局访问点。 
  5.  */  
  6. class MyClass {  
  7.     private static $uniqueInstance;  
  8.     private function __construct() {  
  9.     }  
  10.     public static function getInstance() {  
  11.         if (self::$uniqueInstance == null) {  
  12.             self::$uniqueInstance = new MyClass();  
  13.         }  
  14.         return self::$uniqueInstance;  
  15.     }  
  16. }  
  17. $myClass = MyClass::getInstance();  
  18. var_dump($myClass);  
  19. $myClass = MyClass::getInstance();  
  20. var_dump($myClass);  
  21. ?>  

 

工厂方法模式

 

[php] view plaincopy

 
  1. <?php  
  2. abstract class PizzaStore {  
  3.     public function orderPizza($type) {  
  4.         $pizza = $this->createPizza($type);  
  5.         $pizza->prepare();  
  6.         $pizza->bake();  
  7.         $pizza->cut();  
  8.         $pizza->box();  
  9.         return $pizza;  
  10.     }  
  11.     public abstract function createPizza($type);  
  12. }  
  13. class NYPizzaStore extends PizzaStore {  
  14.     public function createPizza($type) {  
  15.         if ($type == "cheese") {  
  16.             return new NYStyleCheesePizza();  
  17.         } elseif ($type == "veggie") {  
  18.             return new NYStyleVeggiePizza();  
  19.         } elseif ($type == "clam") {  
  20.             return new NYStyleClamPizza();  
  21.         } elseif ($type == "papperoni") {  
  22.             return new NYStylePapperoniPizza();  
  23.         } else {  
  24.             return null;  
  25.         }  
  26.     }  
  27. }  
  28. class ChicagoPizzaStore extends PizzaStore {  
  29.     public function createPizza($type) {  
  30.         if ($type == "cheese") {  
  31.             return new ChicagoStyleCheesePizza();  
  32.         } elseif ($type == "veggie") {  
  33.             return new ChicagoStyleVeggiePizza();  
  34.         } elseif ($type == "clam") {  
  35.             return new ChicagoStyleClamPizza();  
  36.         } elseif ($type == "papperoni") {  
  37.             return new ChicagoStylePapperoniPizza();  
  38.         } else {  
  39.             return null;  
  40.         }  
  41.     }  
  42. }  
  43. abstract class Pizza {  
  44.     public $name;  
  45.     public $dough;  
  46.     public $sauce;  
  47.     public $toppings = array();  
  48.     public function prepare() {  
  49.         echo "Preparing " . $this->name . "/n";  
  50.         echo "Yossing dough.../n";  
  51.         echo "Adding sauce.../n";  
  52.         echo "Adding toppings: /n";  
  53.         for ($i = 0; $i < count($this->toppings); $i++) {  
  54.             echo "    " . $this->toppings[$i] . "/n";  
  55.         }  
  56.     }  
  57.     public function bake() {  
  58.         echo "Bake for 25 minutes at 350/n";  
  59.     }  
  60.     public function cut() {  
  61.         echo "Cutting the pizza into diagonal slices/n";  
  62.     }  
  63.     public function box() {  
  64.         echo "Place pizza in official PizzaStore box/n";  
  65.     }  
  66.     public function getName() {  
  67.         return $this->name;  
  68.     }  
  69. }  
  70. class NYStyleCheesePizza extends Pizza {  
  71.     public function __construct() {  
  72.         $this->name = "NY Style Sauce and cheese Pizza";  
  73.         $this->dough = "Thin Crust Dough";  
  74.         $this->sauce = "Marinara Sauce";  
  75.         $this->toppings[] = "Grated Reggiano Cheese";  
  76.     }  
  77. }  
  78. class NYStyleVeggiePizza extends Pizza {  
  79.     public function __construct() {  
  80.         $this->name = "NY Style Sauce and veggie Pizza";  
  81.         $this->dough = "Thin Crust Dough";  
  82.         $this->sauce = "Marinara Sauce";  
  83.         $this->toppings[] = "Grated Reggiano veggie";  
  84.     }  
  85. }  
  86. class NYStyleClamPizza extends Pizza {  
  87.     public function __construct() {  
  88.         $this->name = "NY Style Sauce and clam Pizza";  
  89.         $this->dough = "Thin Crust Dough";  
  90.         $this->sauce = "Marinara Sauce";  
  91.         $this->toppings[] = "Grated Reggiano clam";  
  92.     }  
  93. }  
  94. class NYStylePapperoniPizza extends Pizza {  
  95.     public function __construct() {  
  96.         $this->name = "NY Style Sauce and papperoni Pizza";  
  97.         $this->dough = "Thin Crust Dough";  
  98.         $this->sauce = "Marinara Sauce";  
  99.         $this->toppings[] = "Grated Reggiano papperoni";  
  100.     }  
  101. }  
  102. class ChicagoStyleCheesePizza extends Pizza {  
  103.     public function __construct() {  
  104.         $this->name = "Chicago Style Deep Dish Cheese Pizza";  
  105.         $this->dough = "Extra Thick Crust Dough";  
  106.         $this->sauce = "Plum Tomato Sauce";  
  107.         $this->toppings[] = "Shredded Mozzarella Cheese";  
  108.     }  
  109.     public function cut() {  
  110.         echo "Cutting the pizza into square slices/n";  
  111.     }  
  112. }  
  113. $myStore = new NYPizzaStore();  
  114. $chicagoStore = new ChicagoPizzaStore();  
  115. $pizza = $myStore->orderPizza("cheese");  
  116. echo "Ethan ordered a " . $pizza->getName() . "/n";  
  117. $pizza = $chicagoStore->orderPizza("cheese");  
  118. echo "Ethan ordered a " . $pizza->getName() . "/n";  
  119. ?>  

 

工厂模式

 

[php] view plaincopy

 
  1. <?php  
  2. abstract class PizzaStore {  
  3.     public function orderPizza($type) {  
  4.         $pizza = $this->createPizza($type);  
  5.         $pizza->prepare();  
  6.         $pizza->bake();  
  7.         $pizza->cut();  
  8.         $pizza->box();  
  9.         return $pizza;  
  10.     }  
  11.     public abstract function createPizza($type);  
  12. }  
  13. class NYPizzaStore extends PizzaStore {  
  14.     public function createPizza($type) {  
  15.         $pizza = null;  
  16.         $ingredientFactory = new NYPizzaIngredientFactory();  
  17.         if ($type == "cheese") {  
  18.             $pizza = new CheesePizza($ingredientFactory);  
  19.             $pizza->setName('New York Style Cheese Pizza');  
  20.         } elseif ($type == "veggie") {  
  21.             $pizza = new VeggiePizza($ingredientFactory);  
  22.             $pizza->setName('New York Style Veggie Pizza');  
  23.         } elseif ($type == "clam") {  
  24.             $pizza = new ClamPizza($ingredientFactory);  
  25.             $pizza->setName('New York Style Clam Pizza');  
  26.         } elseif ($type == "papperoni") {  
  27.             $pizza = new PapperoniPizza($ingredientFactory);  
  28.             $pizza->setName('New York Style Papperoni Pizza');  
  29.         }  
  30.         return $pizza;  
  31.     }  
  32. }  
  33. class ChicagoPizzaStore extends PizzaStore {  
  34.     public function createPizza($type) {  
  35.         if ($type == "cheese") {  
  36.             return new ChicagoStyleCheesePizza();  
  37.         } elseif ($type == "veggie") {  
  38.             return new ChicagoStyleVeggiePizza();  
  39.         } elseif ($type == "clam") {  
  40.             return new ChicagoStyleClamPizza();  
  41.         } elseif ($type == "papperoni") {  
  42.             return new ChicagoStylePapperoniPizza();  
  43.         } else {  
  44.             return null;  
  45.         }  
  46.     }  
  47. }  
  48. interface PizzaIngredientFactory {  
  49.     public function createDough();  
  50.     public function createSauce();  
  51.     public function createCheese();  
  52.     public function createVeggies();  
  53.     public function createPepperoni();  
  54.     public function createClam();  
  55. }  
  56. class NYPizzaIngredientFactory implements PizzaIngredientFactory {  
  57.     public function createDough() {  
  58.         return new ThinCrustDough();  
  59.     }  
  60.     public function createSauce() {  
  61.         return new MarinaraSauce();  
  62.     }  
  63.     public function createCheese() {  
  64.         return new ReggianoCheese();  
  65.     }  
  66.     public function createVeggies() {  
  67.         $veggies = array(  
  68.         new Garlic(),  
  69.         new Onion(),  
  70.         new Mushroom(),  
  71.         new RedPepper(),  
  72.         );  
  73.         return $veggies;  
  74.     }  
  75.     public function createPepperoni() {  
  76.         return new SlicedPepperoni();  
  77.     }  
  78.     public function createClam() {  
  79.         return new FreshClams();  
  80.     }  
  81. }  
  82. class ChicagoPizzaIngredientFactory implements PizzaIngredientFactory {  
  83.     public function createDough() {  
  84.         return new ThickCrustDough();  
  85.     }  
  86.     public function createSauce() {  
  87.         return new PlumTomatoSauce();  
  88.     }  
  89.     public function createCheese() {  
  90.         return new Mozzarella();  
  91.     }  
  92.     public function createVeggies() {  
  93.         $veggies = array(  
  94.         new BlackOlives(),  
  95.         new Spinach(),  
  96.         new EggPlant(),  
  97.         );  
  98.         return $veggies;  
  99.     }  
  100.     public function createPepperoni() {  
  101.         return new SlicedPepperoni();  
  102.     }  
  103.     public function createClam() {  
  104.         return new FrozenClams();  
  105.     }  
  106. }  
  107. abstract class Pizza {  
  108.     public $name;  
  109.     public $dough;  
  110.     public $sauce;  
  111.     public $veggies = array();  
  112.     public $cheese;  
  113.     public $pepperoni;  
  114.     public $clam;  
  115.     public abstract function prepare();  
  116.     public function bake() {  
  117.         echo "Bake for 25 minutes at 350/n";  
  118.     }  
  119.     public function cut() {  
  120.         echo "Cutting the pizza into diagonal slices/n";  
  121.     }  
  122.     public function box() {  
  123.         echo "Place pizza in official PizzaStore box/n";  
  124.     }  
  125.     public function getName() {  
  126.         return $this->name;  
  127.     }  
  128.     public function setName($name) {  
  129.         $this->name = $name;  
  130.     }  
  131.     public function __toString() {  
  132.     }  
  133. }  
  134. class CheesePizza extends Pizza {  
  135.     public $ingredientFactory;  
  136.     public function __construct(PizzaIngredientFactory $ingredientFactory) {  
  137.         $this->ingredientFactory = $ingredientFactory;  
  138.     }  
  139.     public function prepare() {  
  140.         echo "Preparing " . $this->name . "/n";  
  141.         $this->dough = $this->ingredientFactory->createDough();  
  142.         $this->sauce = $this->ingredientFactory->createSauce();  
  143.         $this->cheese = $this->ingredientFactory->createCheese();  
  144.     }  
  145. }  
  146. class ClamPizza extends Pizza {  
  147.     public $ingredientFactory;  
  148.     public function __construct(PizzaIngredientFactory $ingredientFactory) {  
  149.         $this->ingredientFactory = $ingredientFactory;  
  150.     }  
  151.     public function prepare() {  
  152.         echo "Preparing " . $this->name . "/n";  
  153.         $this->dough = $this->ingredientFactory->createDough();  
  154.         $this->sauce = $this->ingredientFactory->createSauce();  
  155.         $this->cheese = $this->ingredientFactory->createCheese();  
  156.         $clam = $this->ingredientFactory->createClam();  
  157.     }  
  158. }  
  159. $nyPizzaStore = new NYPizzaStore();  
  160. $nyPizzaStore->orderPizza('cheese');  
  161. ?>  

 

观察者模式

 

[php] view plaincopy

 
  1. <?php  
  2. /** 
  3.  * 观察者模式 
  4.  * 定义了对象之间的一对多依赖，当一个对象改变状态时， 
  5.  * 它的所有依赖者都会收到通知并自动更新。 
  6.  */  
  7. interface Subject {  
  8.     public function registerObserver(Observer $o);  
  9.     public function removeObserver(Observer $o);  
  10.     public function notifyObservers();  
  11. }  
  12. interface Observer {  
  13.     public function update($temperature, $humidity, $pressure);  
  14. }  
  15. interface DisplayElement {  
  16.     public function display();  
  17. }  
  18. class WeatherData implements Subject {  
  19.     private $observers = array();  
  20.     private $temperature;  
  21.     private $humidity;  
  22.     private $pressure;  
  23.     public function __construct() {  
  24.         $this->observers = array();  
  25.     }  
  26.     public function registerObserver(Observer $o) {  
  27.         $this->observers[] = $o;  
  28.     }  
  29.     public function removeObserver(Observer $o) {  
  30.         if (($key = array_search($o, $this->observers)) !== false) {  
  31.             unset($this->observers[$key]);  
  32.         }  
  33.     }  
  34.     public function notifyObservers() {  
  35.         foreach ($this->observers as $observer) {  
  36.             $observer->update($this->temperature, $this->humidity, $this->pressure);  
  37.         }  
  38.     }  
  39.     public function measurementsChanged() {  
  40.         $this->notifyObservers();  
  41.     }  
  42.     public function setMeasurements($temperature, $humidity, $pressure) {  
  43.         $this->temperature = $temperature;  
  44.         $this->humidity = $humidity;  
  45.         $this->pressure = $pressure;  
  46.         $this->measurementsChanged();  
  47.     }  
  48. }  
  49. class CurrentConditionsDisplay implements Observer, DisplayElement {  
  50.     private $temperature;  
  51.     private $humidity;  
  52.     private $weatherData;  
  53.     public function __construct(Subject $weatherData) {  
  54.         $this->weatherData = $weatherData;  
  55.         $weatherData->registerObserver($this);  
  56.     }  
  57.     public function update($temperature, $humidity, $pressure) {  
  58.         $this->temperature = $temperature;  
  59.         $this->humidity = $humidity;  
  60.         $this->display();  
  61.     }  
  62.     public function display() {  
  63.         echo "温度：" . $this->temperature . "; 湿度：" . $this->humidity . "%/n";  
  64.     }  
  65. }  
  66. class StatistionsDisplay implements Observer, DisplayElement {  
  67.     private $temperature;  
  68.     private $humidity;  
  69.     private $pressure;  
  70.     private $weatherData;  
  71.     public function __construct(Subject $weatherData) {  
  72.         $this->weatherData = $weatherData;  
  73.         $weatherData->registerObserver($this);  
  74.     }  
  75.     public function update($temperature, $humidity, $pressure) {  
  76.         $this->temperature = $temperature;  
  77.         $this->humidity = $humidity;  
  78.         $this->pressure = $pressure;  
  79.         $this->display();  
  80.     }  
  81.     public function display() {  
  82.         echo "温度：" . $this->temperature . "; 湿度：" . $this->humidity . "%; 气压：" . $this->pressure . "/n";  
  83.     }  
  84. }  
  85. $weatherData = new WeatherData();  
  86. $currentDisplay = new CurrentConditionsDisplay($weatherData);  
  87. $statistionDisplay = new StatistionsDisplay($weatherData);  
  88. $weatherData->setMeasurements(10, 20, 30);  
  89. $weatherData->removeObserver($currentDisplay);  
  90. $weatherData->setMeasurements(30, 40, 50);  
  91. ?>  

 

命令模式

 

[php] view plaincopy

 
  1. <?php  
  2. class Light {  
  3.     public function __construct() {  
  4.     }  
  5.     public function on() {  
  6.         echo "Light On/n";  
  7.     }  
  8.     public function off() {  
  9.         echo "Light Off/n";  
  10.     }  
  11. }  
  12. interface Command {  
  13.     public function execute();  
  14. }  
  15. class LightOnCommand implements Command {  
  16.     public $light;  
  17.     public function __construct(Light $light) {  
  18.         $this->light = $light;  
  19.     }  
  20.     public function execute() {  
  21.         $this->light->on();  
  22.     }  
  23. }  
  24. class SimpleRemoteControl {  
  25.     public $slot;  
  26.     public function __construct() {  
  27.     }  
  28.     public function setCommand(Command $command) {  
  29.         $this->slot = $command;  
  30.     }  
  31.     public function buttonWasPressed() {  
  32.         $this->slot->execute();  
  33.     }  
  34. }  
  35. class RemoteControlTest {  
  36.     public static function main() {  
  37.         $remote = new SimpleRemoteControl();  
  38.         $light = new Light();  
  39.         $lightOn = new LightOnCommand($light);  
  40.         $remote->setCommand($lightOn);  
  41.         $remote->buttonWasPressed();  
  42.     }  
  43. }  
  44. RemoteControlTest::main();  
  45. ?>  

 

 

装饰者模式

 

[php] view plaincopy

 
  1. <?php  
  2. /** 
  3.  * 装饰着模式 
  4.  * 动态地将责任附加到对象上，若要扩展功能，装饰者提供了比继承更有弹性的替代方案。 
  5.  */  
  6. abstract class Beverage {  
  7.     public $description = "Unknown Beverage";  
  8.     public function getDescription() {  
  9.         return $this->description;  
  10.     }  
  11.     public abstract function cost();  
  12. }  
  13. abstract class CondimentDecorator extends Beverage {  
  14.     //JAVA代码里这里是个抽象类，PHP不允许这么做  
  15.     public function getDescription() {  
  16.         return $this->description;  
  17.     }  
  18. }  
  19. class Espresso extends Beverage {  
  20.     public function __construct() {  
  21.         $this->description = "Espresso";  
  22.     }  
  23.     public function cost() {  
  24.         return 1.99;  
  25.     }  
  26. }  
  27. class HouseBlend extends Beverage {  
  28.     public function __construct() {  
  29.         $this->description = "HouseBlend";  
  30.     }  
  31.     public function cost() {  
  32.         return .89;  
  33.     }  
  34. }  
  35. class DarkRoast extends Beverage {  
  36.     public function __construct() {  
  37.         $this->description = "DarkRoast";  
  38.     }  
  39.     public function cost() {  
  40.         return .99;  
  41.     }  
  42. }  
  43. class Mocha extends CondimentDecorator {  
  44.     public $beverage;  
  45.     public function __construct(Beverage $beverage) {  
  46.         $this->beverage = $beverage;  
  47.     }  
  48.     public function getDescription() {  
  49.         return $this->beverage->getDescription() . ", Mocha";  
  50.     }  
  51.     public function cost() {  
  52.         return .20 + $this->beverage->cost();  
  53.     }  
  54. }  
  55. class Whip extends CondimentDecorator {  
  56.     public $beverage;  
  57.     public function __construct(Beverage $beverage) {  
  58.         $this->beverage = $beverage;  
  59.     }  
  60.     public function getDescription() {  
  61.         return $this->beverage->getDescription() . ", Whip";  
  62.     }  
  63.     public function cost() {  
  64.         return .10 + $this->beverage->cost();  
  65.     }  
  66. }  
  67. class Soy extends CondimentDecorator {  
  68.     public $beverage;  
  69.     public function __construct(Beverage $beverage) {  
  70.         $this->beverage = $beverage;  
  71.     }  
  72.     public function getDescription() {  
  73.         return $this->beverage->getDescription() . ", Soy";  
  74.     }  
  75.     public function cost() {  
  76.         return .15 + $this->beverage->cost();  
  77.     }  
  78. }  
  79. $beverage = new Espresso();  
  80. echo $beverage->getDescription() . "/n";  
  81. $beverage2 = new DarkRoast();  
  82. $beverage2 = new Mocha($beverage2);  
  83. $beverage2 = new Mocha($beverage2);  
  84. $beverage2 = new Whip($beverage2);  
  85. echo $beverage2->getDescription() . " $" . $beverage2->cost() . "/n";  
  86. $beverage3 = new HouseBlend();  
  87. $beverage3 = new Soy($beverage3);  
  88. $beverage3 = new Mocha($beverage3);  
  89. $beverage3 = new Whip($beverage3);  
  90. echo $beverage3->getDescription() . " $" . $beverage3->cost() . "/n";  
  91. ?>  

 

状态模式

 

[php] view plaincopy

 
  1. <?php  
  2. class GumballMachine {  
  3.     const SOLD_OUT = 0;  
  4.     const NO_QUARTER = 1;  
  5.     const HAS_QUARTER = 2;  
  6.     const SOLD = 3;  
  7.     public $state = self::SOLD_OUT;  
  8.     public $count = 0;  
  9.     public function __construct($count) {  
  10.         $this->count = $count;  
  11.         if ($count > 0) {  
  12.             $this->state = self::NO_QUARTER;  
  13.         }  
  14.     }  
  15.     public function insertQuarter() {  
  16.         if ($this->state == self::HAS_QUARTER) {  
  17.             echo "You can't insert another quarter!/n";  
  18.         } else if ($this->state == self::NO_QUARTER) {  
  19.             $this->state = self::HAS_QUARTER;  
  20.             echo "You inserted a quarter!/n";  
  21.         } else if ($this->state == self::SOLD_OUT) {  
  22.             echo "You can't insert a quarter, the machine is sold out!/n";  
  23.         } else if ($this->state == self::SOLD) {  
  24.             echo "Please wait, we're already giving you a gumball!/n";  
  25.         }  
  26.     }  
  27. }  
  28. $obj = new GumballMachine(0);  
  29. print_r($obj)  
  30. ?>  

 

标签: , , , 没有评论
241月/13关

jQuery 中使用 JSON

发布在 邵珠庆

 

JSON 格式

json 是 Ajax 中使用频率最高的数据格式，在浏览器和服务器中之间的通讯可离不开它。

JSON 的格式说明可以在可以这里看到，非常详细，还是中文的。

 JSON 格式说明

需要特别注意的是，在 JSON 中的属性名是需要使用引号引起来的。

 jQuery 中使用 JSON

jQuery 是现在使用广泛的脚本库，那么，在 jQuery 中如何使用 JSON 呢？

解析 JSON

在 jQuery 中已经提供了对于解析 JSON 的内在支持，

jQuery.parseJSON 函数提供了解析的支持，详细的说明见这里。

var obj = jQuery.parseJSON('{"name":"John"}');  
alert( obj.name === "John" );

使用对象生成 JSON 格式串

在 jQuery 中并没有提供直接将普通的 JavaScript 对象转换为 JSON 串的方法，可以使用下面的扩展库来完成。

jquery-json 扩展库

这个库用来扩展 jQuery ，对于 JSON 的使用，扩展了两个方法。

toJSON 方法用来将一个普通的 JavaScript 对象序列化为 JSON 串。

var thing = {plugin: 'jquery-json', version: 2.3};    
var encoded = $.toJSON( thing ); // '{"plugin":"jquery-json","version":2.3}'

evalJSON 方法将一个 JSON 串解析为一个普通的 JavaScript 对象。

var thing = {plugin: 'jquery-json', version: 2.3};    
var encoded = $.toJSON( thing ); // '{"plugin":"jquery-json","version":2.3}'   
var name = $.evalJSON( encoded ).plugin; // "jquery-json"   
var version = $.evalJSON(encoded).version; // 2.3

这个扩展的下载地址：http://code.google.com/p/jquery-json/

使用 jQuery 配合 WCF

客户端

jQuery 中的 $.post 可以直接向服务器发出请求，将服务器返回的数据按照 JSON 方式进行解析，不过，需要注意下面几点：

请求的内容类型必须为  json 格式，这可以通过上面的 jQuery-json 扩展库来完成，需要特别注意的在请求的 contentType 也必须使用  text/json 进行说明，默认的 post 使用普通的名值对方式请求，因此 contentType 是： application/x-www-form-urlencoded，可以通过 $.ajaxSetup 来进行设置：

// Ajax 设置  
$.ajaxSetup({ contentType: 'text/json' });

这样，请求的内容类型就设置为需要的类型。

其次，实际的请求内容必须使用 JSON 方式，这可以通过扩展库的 $.toJSON 来实现，例如：

$.toJSON({ x: 2, y: 3 })

  

这样，如果服务器端提供了一个服务方法 Sum，定义如下：

public int Sum(int x, int y)  
{  
    return x + y;  
}

就可以如下调用了。注意，WCF 返回的数据在属性 d 中。

复制代码
// Ajax 设置  
$.ajaxSetup({ contentType: 'text/json' });  

$("#wcfBtn").click(function () {  
    $.post("Service1.svc/Sum", $.toJSON({ x: 2, y: 3 }), function (data) {  
        alert(data.d);  
    });  
});
复制代码

服务器端的配置

首先，为服务增加标签：[System.ServiceModel.Activation.AspNetCompatibilityRequirements(RequirementsMode = System.ServiceModel.Activation.AspNetCompatibilityRequirementsMode.Allowed)]

复制代码
// #1  
// 为了在脚本中使用,必须增加这个标签  
[System.ServiceModel.Activation.AspNetCompatibilityRequirements( 
    RequirementsMode = System.ServiceModel.Activation.AspNetCompatibilityRequirementsMode.Allowed)]  

// #2  
// 在网站的配置文件中也需要进行设定  
public class Service1 : IService1  
{  
    public int Sum(int x, int y)  
    {  
        return x + y;  
    }  
}
复制代码

  

然后，在网站的配置文件中，如下配置。

复制代码
<system.serviceModel>  
  <!-- 为了支持在浏览器端调用 WCF 服务的特定配置 -->  
  <serviceHostingEnvironment aspNetCompatibilityEnabled="true">  
    <serviceActivations>  

      <!-- relativeAddress 服务的地址  
           service 实现服务的类型，全名，包含命名空间，甚至程序集  
           factory 是 WCF 系统提供，直接使用  
      -->  

      <add relativeAddress="Service1.svc" service="MServer.Service1"  factory="System.ServiceModel.Activation.WebScriptServiceHostFactory"   
           />  
    </serviceActivations>  
  </serviceHostingEnvironment>  

    <behaviors>  
        <serviceBehaviors>  
            <behavior name="">  
                <serviceMetadata httpGetEnabled="true" />  
                <serviceDebug includeExceptionDetailInFaults="false" />  
            </behavior>  
        </serviceBehaviors>  
    </behaviors>  
</system.serviceModel>
复制代码

 

标签: , 没有评论
141月/13关

Zend Studio9 配置优化

发布在 邵珠庆

 

今天使用ZendStudio9的时候再次被卡得想死，ctrl+s保存文件的时候zend会先build什么东西，然后才进行save操作，每次如此。突然好怀念当初使用的zendStudio5.5，完全只是php的开发环境。而在6.0之后的版本都成为了ZendStudio for eclipse，也就是均是基于eclipse的。功能很强大，但能用到的却不多，还很占用资源。真想把他换了。但找来找去，还真找不到一个能比拟ZendStudio的开发环境，也不是很想退回去使用5.5的版本。

        那么我就自己研究Zend Studio的菜单栏和工具栏，看看有没有可以优化的配置，以下说明不一定正确：

1、关闭自动Build：
将 Project -> Build Automatically 前面的勾选取消掉
在使用中，我发现Build的作用应该是为整个项目建立一个索引和预读取，加快查找和载入文件的速度，但不必要让zend 自动Build项目，他还没有聪明到知道自己该什么时候build才会让主人不觉得卡，所以，取消Build Automatically会让你觉得你的Zend Studio跑的快了点。你可以在添加完项目或者在修改过项目之后，右键点击项目，然后选择Build Project

2、开启智能插入模式
勾选 Edit->Smart Insert Mode

3、快捷键加注释
使用ctrl + / 增加和取消一行的注释
使用ctrl + shift + / 注释一个代码块
使用ctrl + shift + 取消注释一个代码块

4、设置代码格式
Window->Preferences->PHP->Code Style->Formatter

选择Show之后，可以设置类、方法、for语句块、switch语句中的代码是否需要缩进，设置类、方法、语句块中的前半个大括号是直接跟在本行结尾还是换到下一行，还有许多，可以自己查看

选择文件：使用快捷键ctrl + shift + f可以快速将你的php文件格式化为你设置的格式，也可以使用菜单栏的Source -> Format

5、修改配置文件ZendStudio.ini
加大zendstudio的使用内存，也就是讲XXMaxPermSize加大到512m，如果你的内存足够大到4G，那么你这里使用1024都可以，修改完后的配置文件内容如下：

 

-startup
plugins/org.eclipse.equinox.launcher_1.2.0.v20110502.jar
--launcher.library
plugins/org.eclipse.equinox.launcher.win32.win32.x86_1.1.100.v20110502
--launcher.XXMaxPermSize
512m
--launcher.defaultAction
openFile
-showlocation
-name
Zend Studio
-vmargs
-Xms128M
-Xmx512M
-DGIT_SSL_NO_VERIFY=true
 

6、加快鼠标经过时代码提示速度
选择Window -> Preferences -> PHP -> Editor -> Content Assist ->Auto Activation
将Auto activation delay(in msecs)设置为50，默认值可能是200或者500

7、使用空格代替tab
选择Window -> Preferences -> PHP -> Code Style -> Formatter
一、选择Zend Framework Coventions[build-in]，然后在Window -> Preferences -> General -> Editors -> Text Editors中如下设置：

二、如果是自定义的话，点击Edit，在Indentation选项卡中，设置Tab policy为Spaces，然后在Indentation size填写使用的空格数，

8、快速搜索方法和类：
之前我更习惯于在项目文件夹上直接点击右键，然后选择Search进行查找，这样的话ZendStudio会去扫描所有文件，比较耗时。
如果只是需要查找方法的话，可以使用快捷键ctrl + shift + M
根据类名称查找的话使用快捷键ctrl + shift + T
速度真的很快

9、添加新的文件类型：

drupal中的模块后缀名是*.module，我们使用zend打开的时候是纯文本内容，不会有代码高亮的效果，设置方法：
选择：Window -> Preferences -> General -> Content Types
点开右侧的Text，选择php content type，点击Add按钮，在弹出框中输入*.module，最后保存即可

将*.tpl添加到HTML中也是类似操作

标签: , , , , , , , , 没有评论
111月/13关

git查看某个文件的修改历史

发布在 邵珠庆

 

有时候在比对代码时，看到某些改动，但不清楚这个改动的作者和原因，也不知道对应的CR号，也就是说无从查到这些改动的具体原因了～

【注】：某个文件的改动是有限次的，而且每次代码修改的提交都会有commit描述，我们可以从这里进行入手；

一、切换到目录

首先切换到要查看的文件所在的目录：

cd packages/apps/Mms/src/com/android/mms/ui/



二、git log --pretty

然后使用下面的命令可列出文件的所有改动历史，注意，这里着眼于具体的一个文件，而不是git库，如果是库，那改动可多了去了～

git log --pretty=oneline 文件名

如：

复制代码
root@ubuntu:android_src/packages/apps/Mms/src/com/android/mms/ui# git log --pretty=oneline MessageItem.java 
27209385caf678abe878375a470f4edd67a2d806 fix cr 17973 to process force close when empty address contained in card
0e04b16f1dad7dc0a36e2235f7337bc656c365c7 display for 1970-1-1
e4abf3a213197491e0855e101117b59b5dc0160d HREF#13954 receive, store, and display wap push
356f6def9d3fb7f3b9032ff5aa4b9110d4cca87e HREF#16265_uim_show_time_error
350f9d34c35ab50bdb4b2d43fb3ff9780e6c73fa fix href#13617 and href#15149
715e32f97bd9d8ce4b5ba650b97ba4b137150456 Fix ANR from calling Contact.get()
fd8357ff5febab0141e1beb8dd3b26f70416b108 Fix missing From field
d130e2e6dc448fd80ecb70f0d31e3affb9888b9a fix bug 2112925: don't display zip file garbage content in MMS.
0e19f738c114f86d0d88825ee48966015fb48b6d Don't always show sent timestamp
52f854cbb75e8f9975c7e33216b828eb2f981095 Don't show Anonymous as the MMS sender
331864544ec51ba6807fc5471cc6d537b7fef198 add search capability
33a87f96f8c625aa10131a77a3968c97c4ec5a62 Remove all references to ContactInfoCache except those in Contact.
70c73e05a792832aa28da751cdaf3fa83a7b8113 Begin moving all conversation data behind a data model with a cache.
48da875f1beea835c6771977e5bd8a9aa3d4bc10 Begin adding UI unit tests to the Mms app.
66dde9460badebf8e740275cabde9cca256006eb Stop requiring a Context to be passed in to ContactInfoCache.
591d17e9a51bb9f829d6860dc7aa0bad25062cd5 auto import from //branches/cupcake_rel/...@138607
72735c62aba8fd2a9420a0f9f83d22543e3c164f auto import from //depot/cupcake/@135843
892f2c5bf965b1431ae107b602444a93f4aad4a3 auto import from //depot/cupcake/@135843
153ae99e0a7d626a24d61475eeb133249deb448c auto import from //depot/cupcake/@132589
abd7b2d90f7491075f1daba4b4cccdfc82f8ddd1 auto import from //depot/cupcake/@137055
59d72c57ce9c319b6cd43ce2ab36b7076c9e821f auto import from //branches/cupcake/...@132276
44cea74dc55e2459262d0d765ef4a69267dd09b0 auto import from //branches/cupcake/...@131421
0f236f55349f070ac94e12cca963847173393da8 Code drop from //branches/cupcake/...@124589
8eed706474910ccb978acda03e85d3261037da6e Initial Contribution
复制代码

 三、git show



如上所示，打印出来的就是针对文件MessageItem.java的所有的改动历史，每一行最前面的那一长串数字就是每次提交形成的哈希值，接下来使用git show即可显示具体的某次的改动的修改～

git show 356f6def9d3fb7f3b9032ff5aa4b9110d4cca87e

结果如下：

复制代码
root@ubuntu:/android_src/packages/apps/Mms/src/com/android/mms/ui# git show 356f6def9d3fb7f3b9032ff5aa4b9110d4cca87e
commit 356f6def9d3fb7f3b9032ff5aa4b9110d4cca87e
Author: 某某某 <某某某的邮箱>
Date:   Thu Jan 6 01:50:31 2011 +0800

    修改的描述（是该代码commit时所填）
    
    Signed-off-by: 某某某 <某某某的邮箱>

diff --git a/src/com/android/mms/ui/MessageItem.java b/src/com/android/mms/ui/MessageItem.java
index 0a0c4b7..55c3b27 100644
--- a/src/com/android/mms/ui/MessageItem.java
+++ b/src/com/android/mms/ui/MessageItem.java
+
+ 列出具体的改动
-
-
复制代码

这样就可以知道是谁做了修改，以及具体的修改代码～

那接下来不管是直接去找他交流还是研究代码，都有依据了～

标签: , 没有评论
51月/13关

Git .gitignore 設定與注意事項 – 以Zim操作為範例

发布在 邵珠庆

 

Git 設定 .gitignore, 設定完成就都直接生效, 在測試時都很正常, 但是實際使用 卻沒有生效, 有點軌異.

 

環境

  • Git 所管理的專案名稱、位置: /home/user/doc

下述範例是以 Zim 為主, Zim 是一套桌面的 Wiki 編輯器, 裡面寫的內容都會存成 txt 檔, .zim 的目錄下會存 “*.cache” 和 “zim 本身自己的設定值”.

Zim 在剛開始建立完成後, 就使用下述步驟:

  1. cd /home/user/doc
  2. git init
  3. git commit -a
  4. git push #一開始沒有設定 .gitignore, 所以會將 .zim/* 都 commit 進去

於每次開啟 Zim 後, 都會出現

modified:   .zim/history.cache
modified:   .zim/index.cache

造成 git commit -a 的麻煩 (因為多台電腦要同步時, index.cache / history.cache 都會出現需要 merge 的狀況), 所以想設定 .gitignore 來把它拿掉. (方便 git commit -a)

設定 .gitignore 位置、方法

設定 Git ignore 的方式都一樣, 有下面幾個地方可以設定, 依自己喜好 / 需求來設定即可.(設定位置)

  • vim ~/.gitignore # 對所有 Git 的專案生效 (自己的 home 目錄下)
  • vim doc/.gitignore # doc 是專案名稱, 用這個的好處是, 將 .gitignore commit 進去, 此 .gitignore 可以隨著專案到處走. (Git 管理的 Project 目錄下)
  • vim doc/.git/info/exclude # 只有單獨於此處 .git 生效 (Project 的 .git/info/exclude 檔案)
  • 這幾個地方都可以設定, 可以使用 * 等符號. 詳可見: gitignore(5) Manual Page

於 .zim 的狀況, 可以設定下述: (設定方法)

  • 所有 . 開頭的目錄 / 檔案都不 commit

    .*

  • .zim 目錄內 的 所有 *.cache 都不 commit

    .zim/*.cache

  • 只有 .zim/history.cache, .zim/index.cache 不 commit

    .zim/history.cache
    .zim/index.cache

.gitignore 無法生效 的 問題修復

在測試狀況都是正常, 但是在 Zim 實際使用就有問題, 每次都出現 modified 的解法.

解法
  1. 因為第一次 commit 已經將 .zim/*.cache commit 進去了, 所以每次它都會去檢查, 造成都出現 modified 的狀況.
  2. git rm -f .zim/history.cache
  3. git rm -f .zim/index.cache
  4. git commit # 即可
  5. 再將 .gitignore 設定好, 就可以避免掉這些狀況囉~ icon smile Git .gitignore 設定 與 注意事項 以 Zim 操作為範例

範例 -我的 Zim 設定方式

  1. cd /home/user/doc
  2. vim .gitignore

    .zim/*.cache

  3. git add .gitignore
  4. git commit
  5. git push
标签: , , 没有评论
11月/13关

Zend Studio 9.0.4正式版注册破解

发布在 邵珠庆

以下方法仅供技术交流学习，请勿非法使用，如长期使用请支持购买正版。
正版购买地址：http://shop.zend.com/en/zend-studio-for-eclipse.html

你还没有最新安装程序？

ZendStudio下载地址：http://www.geekso.com/component/zendstudio-downloads/

注册破解步骤

第一步：如果已经安装过Zend Studio 9.0.4的,请打开Zend Studio 9.0.4,在菜单中“help>Unregister”,如果显示是灰的跳过此步退出Zend Studio。如果显示可以点击的请点击，这时Zend Studio会重启，重启到要求你填注册码时点“QUIT”按钮



第二步：请根据你使用的Zend Studio版本下载对应的破解文件：

ZendStudio9.0破解文件com.zend.php.core_9.0.0.201111081531.jar (已下载 12120 次)

ZendStudio9.0.1破解文件com.zend.php.core_9.0.1.201112141951.jar (已下载 17358 次)

ZendStudio9.0.2破解文件com.zend.php.core_9.0.2.201202240955.jar (已下载 25255 次)

ZendStudio9.0.3破解文件com.zend.php.core_9.0.3.201206251721.jar (已下载 10651 次)

ZendStudio9.0.4破解文件com.zend.php.core_9.0.4.201210081806.jar (已下载 24400 次)

Zend Studio 10 Beta测试版官方下载地址——更新2012-10-25

Windows ： 官方下载 | 复制地址

Linux—32： 官方下载 | 复制地址

Linux—64： 官方下载 | 复制地址

Mac OS X： 官方下载 | 复制地址

Zend Studio 9.0.4 正式版官方下载地址——更新2012-10-12

Windows ： 官方下载 | 复制地址

Linux—32： 官方下载 | 复制地址

Linux—64： 官方下载 | 复制地址

Mac OS X： 官方下载 | 复制地址

Zend Studio 9.0.3 正式版官方下载地址——更新2012-05-10

Windows ： 官方下载 | 复制地址

Linux—32： 官方下载 | 复制地址

Linux—64： 官方下载 | 复制地址

Mac OS X： 官方下载 | 复制地址

Zend Studio 9.0.2 正式版官方下载地址——更新2012-03-05

Windows ： 官方下载 | 复制地址

Linux—32： 官方下载 | 复制地址

Linux—64： 官方下载 | 复制地址

Mac OS X： 官方下载 | 复制地址

Zend Studio 9.0.1 正式版官方下载地址——更新2011-12-16

Windows ： 官方下载 | 复制地址

Linux—32： 官方下载 | 复制地址

Linux—64： 官方下载 | 复制地址

Mac OS X： 官方下载 | 复制地址

Zend Studio 9.0.0 正式版官方下载地址

Windows ： 官方下载 | 复制地址

Linux—32： 官方下载 | 复制地址

Linux—64： 官方下载 | 复制地址

Mac OS X： 官方下载 | 复制地址

提示：com.zend.php.core_9.0.4.201210081806.jar对应的版本号为9.0.4.v20121009466



下载成功后(提示：破解文件千万不要解压,也不要修改破解文件的文件名)复制到你安装Zend Studio 9.0.4的plugins目录下，覆盖同名文件。



第三步：启动Zend Studio,复制如下注册码License key,粘贴(粘贴快捷键是ctrl+v)到注册框中

  复制注册码

提示：先覆盖第二步当中的破解文件，然后在启动Zend Studio输入注册码。



第四步：查看是否注册成功，在菜单中“help>About Zend Studio ”, 显示如下图。

过期时间9999年12月31日说明注册破解成功完成。

【已解决问题】

2011-12-06：解决同一局域网内相同的key只能使用一台的问题。如你遇到提示“user license number 1 is already in use by 1 users”，请重新下载破解文件。

zend studio9.0.4汉化及常见问题解答：http://www.geekso.com/zendstudioquestion/

win7 64位32位,window server2008 64位,mac版都没问题，如果遇到无法注册的请留言。

我试了在CentOS(32位)操作系统下用此方法注册Zend Studio 9.0.4成功，所以Linux操作系统是没有问题的。以下是我在Linux操作系统注册成功的截图：

查看截图：http://www.geekso.com/attachment/201112/1323070502_8926bffc.png

你没破解成功，不防看一下是不是这个原因造成的？

最近发现好多朋友告诉我说注册破解没有成功，我看了下主要是因为把下载的那个破解包给解压了，造成破解不成功。所以下载完这个破解包后千万不要解压，直接覆盖到你安装Zend Studio 9.0.4的plugins目录下的同名文件。还有查看注册码复制的对不对。

为什么我复制破解文件到plugins目录时没有提示已存在同名文件？

原因1:是你下载的是9.0的测试版。建议下载最新版本的Zend Studio9.0.4，下载地址：http://www.geekso.com/component/zendstudio-downloads/

原因2:下载的破解文件版本跟你的安装的ZendStudio版本不一样。

原因3:下载的破解文件文件名跟我发布的破解文件名不一样，有可能在下载的时侯被修改了，请核对确认文件名是否被修改，必须跟我发布的文件名是一模一样的。

Linux操作系统破解zendstudio都按上面操作了，但在复制注册码时还是显示不正确？

注册码复制进去后，按下 ctrl+z (回滚)，一直按回滚，一直滚到无法回滚的时候这个注册码就变成绿色的勾了！

如果以上方法你还是没有破解成功，请添加QQ群解答ZendStudio破解问题

1号QQ群：204192303（已满）。

2号QQ群：204192304（已满）。

3号QQ群：187586326（已满）。

同时也附上两个最新的zendStudio 10测试版的试用注册码(有效期2012年12月9号)：

D4B4FE7A9260B5826E783F714A40797CFE9BE053BE30441E83EDE67B7627EC3F5FB1BC1523AEB8E1D3DA89CE15147EFF7DF70BEC475D3938D5386E034D3C08824576616C753B30392F31322F323031323B31302E303B3030313B313B3336

zendStudio 10第二个注册码(有效期2013年01月15号)：

5A327570FFF0DA1BEC27A342E37E54D7D557BCAFD0845C80315A4A09851D00B8E3547BD8FF5DF8B4E15845D0BBE49FFF4662F46DE48BB09BD28578DD21F05EF74576616C753B31352F30312F323031333B31302E303B3030313B313B3337

转自http://www.geekso.com/ZendStudio9-key/

标签: , , 没有评论
1910月/12关

jQuery性能优化指南

发布在 邵珠庆

现在jquery应用的越来越多, 有些同学在享受爽快淋漓coding时就将性能问题忽略了,  比如我.  jquery虽在诸多的js类库中性能表现还算优秀, 但毕竟不是在用原生的javascript开发, 性能问题还是需要引起重视的. 在twitter上发现了<jQuery Performance Rules>这篇文章, 简单的摘译了一下:

  1. 总是从ID选择器开始继承
  2. 在class前使用tag
  3. 将jquery对象缓存起来
  4. 掌握强大的链式操作
  5. 使用子查询
  6. 对直接的DOM操作进行限制
  7. 冒泡
  8. 消除无效查询
  9. 推迟到 $(window).load
  10. 压缩js
  11. 全面掌握jquery库

 

1. 总是从ID选择器开始继承

在jquery中最快的选择器是ID选择器. 因为它直接来自于Javascript的getElementById()方法.

<div id=“content”>

<form method=“post” action=“/”>

<h2>Traffic Light</h2>

<ul id=“traffic_light”>

<li><input type=“radio” class=“on” name=“light” value=“red” /> Red</li>

<li><input type=“radio” class=“off” name=“light” value=“yellow” /> Yellow</li>

<li><input type=“radio” class=“off” name=“light” value=“green” /> Green</li>

</ul>

<input class=“button” id=“traffic_button” type=“submit” value=“Go” />

</form>

</div>

像这样选择按钮是低效的:

var traffic_button = $(‘#content .button’);

用ID直接选择按钮效率更高:

var traffic_button = $(‘#traffic_button’);

选择多个元素

提到多元素选择其实是在说DOM遍历和循环, 这些都是比较慢的东西.为了提高性能, 最好从就近的ID开始继承.

var traffic_lights = $(‘#traffic_light input’);

2. 在class前使用tag

第二快的选择器是tag选择器($(’head’)). 同理,因为它来自原生的getElementsByTagName() 方法.

<div id=“content”>

<form method=“post” action=“/”>

<h2>Traffic Light</h2>

<ul id=“traffic_light”>

<li><input type=“radio” class=“on” name=“light” value=“red” /> Red</li>

<li><input type=“radio” class=“off” name=“light” value=“yellow” /> Yellow</li>

<li><input type=“radio” class=“off” name=“light” value=“green” /> Green</li>

</ul>

<input class=“button” id=“traffic_button” type=“submit” value=“Go” />

</form>

</div>$$

总是用一个tag name来限制(修饰)class (并且不要忘记就近的ID):

var active_light = $(‘#traffic_light input.on’);

注意: 在jquery中Class是最慢的选择器. IE浏览器下它会遍历所有DOM节点不管它用在那里.

不要用用tag name来修饰ID. 下面的例子将会遍历所有的div元素来查找id为’content’的哪一个节点:

var content = $(‘div#content’);

用ID修饰ID也是画蛇添足:

var traffic_light = $(‘#content #traffic_light’);

3.将jquery对象缓存起来

要养成将jquery对象缓存进变量的习惯.

永远不要这样做:

$(‘#traffic_light input.on).bind(’click‘, function(){…});

$(’#traffic_light input.on).css(‘border’, ‘3px dashed yellow’);

$(‘#traffic_light input.on).css(’background-color‘, ‘orange‘);

$(’#traffic_light input.on).fadeIn(’slow’);

最好先将对象缓存进一个变量然后再操作:

var $active_light = $(‘#traffic_light input.on’);

$active_light.bind(‘click’, function(){…});

$active_light.css(‘border’, ‘3px dashed yellow’);

$active_light.css(‘background-color’, ‘orange’);

$active_light.fadeIn(’slow’);

为了记住我们本地变量是jquery的封装, 通常用一个$作为变量前缀. 记住,永远不要让相同的选择器在你的代码里出现多次.

缓存jquery结果,备用

如果你打算将jquery结果对象用在程序的其它部分,或者你的function会多次执行, 那么就将他们缓存到一个全局变量中.

定义一个全局容器来存放jquery结果, 我们就可以在其它函数引用它们:

// 在全局范围定义一个对象 (例如: window对象)

window.$my ={

// 初始化所有可能会不止一次要使用的查询

head : $(‘head’),

traffic_light : $(‘#traffic_light’),

traffic_button : $(‘#traffic_button’)

};

function do_something(){

// 现在你可以引用存储的结果并操作它们

var script = document.createElement(’script’);

$my.head.append(script);

// 当你在函数内部操作是, 可以继续将查询存入全局对象中去.

$my.cool_results = $(‘#some_ul li’);

$my.other_results = $(‘#some_table td’);

// 将全局函数作为一个普通的jquery对象去使用.

$my.other_results.css(‘border-color’, ‘red’);

$my.traffic_light.css(‘border-color’, ‘green’);

}

4. 掌握强大的链式操作

上面的例子也可以写成这样:

var $active_light = $(‘#traffic_light input.on’);$active_light.bind(‘click’,function(){…})

.css(‘border’, ‘3px dashed yellow’)

.css(‘background-color’, ‘orange’)

.fadeIn(’slow’);

这样可以写更少的代码, 让我们的js更轻量.

5.使用子查询

jQuery 允许我们对一个已包装的对象使用附加的选择器操作. 因为我们已经在保存了一个父级对象在变量里, 这样大大提高对其子元素的操作:

<div id=“content”>

<form method=“post” action=“/”>

<h2>Traffic Light</h2>

<ul id=“traffic_light”>

<li><input type=“radio” class=“on” name=“light” value=“red” /> Red</li>

<li><input type=“radio” class=“off” name=“light” value=“yellow” /> Yellow</li>

<li><input type=“radio” class=“off” name=“light” value=“green” /> Green</li>

</ul>

<input class=“button” id=“traffic_button” type=“submit” value=“Go” />

</form>

</div>

例如, 我们可以用子查询的方法来抓取到亮或不亮的灯, 并缓存起来以备后续操作.

var $traffic_light = $(‘#traffic_light’),

$active_light = $traffic_light.find(‘input.on’),

$inactive_lights = $traffic_light.find(‘input.off’);

提示: 你可以用逗号分隔的方法一次声明多个局部变量–节省字节数



6.对直接的DOM操作进行限制

这里的基本思想是在内存中建立你确实想要的东西，然后更新DOM 。这并不是一个jQuery最佳实践，但必须进行有效的JavaScript操作 。直接的DOM操作速度很慢。

例如,你想动态的创建一组列表元素, 千万不要这么做:

var top_100_list = [...], // 假设这里是100个独一无二的字符串

$mylist = $(‘#mylist’); // jQuery 选择到 <ul> 元素

for (var i=0, l=top_100_list.length; i<l; i++){

$mylist.append(‘<li>’ + top_100_list[i] + ‘</li>’);

}

我们应该将整套元素字符串在插入进dom中之前全部创建好:

var top_100_list = [...],

$mylist = $(‘#mylist’),

top_100_li = “”; // 这个变量将用来存储我们的列表元素

for (var i=0, l=top_100_list.length; i<l; i++){

top_100_li += ‘<li>’ + top_100_list[i] + ‘</li>’;

}

$mylist.html(top_100_li);

我们在插入之前将多个元素包裹进一个单独的父级节点会更快:

var top_100_list = [...],

$mylist = $(‘#mylist’),

top_100_ul = ‘<ul id=”#mylist”>’;

for (var i=0, l=top_100_list.length; i<l; i++){

top_100_ul += ‘<li>’ + top_100_list[i] + ‘</li>’;

}

top_100_ul += ‘</ul>’; //关闭无序列表

$mylist.replaceWith(top_100_ul);

如果你做了以上几条还是担心有性能问题,那么:

  • 试试jquery的 clone() 方法, 它会创建一个节点树的副本, 它允许以”离线”的方式进行dom操作, 当你操作完成后再将其放回到节点树里.
  • 使用DOM DocumentFragments. 正如jQuery作者所言, 它的性能要明显优于直接的dom操作.

7. 冒泡

除非在特殊情况下, 否则每一个js事件(例如:click, mouseover, 等.)都会冒泡到父级节点. 当我们需要给多个元素调用同个函数时这点会很有用.

代替这种效率很差的多元素事件监听的方法就是, 你只需向它们的父节点绑定一次, 并且可以计算出哪个节点触发了事件.

例如, 我们要为一个拥有很多输入框的表单绑定这样的行为: 当输入框被选中时为它添加一个class

像这样绑定事件是低效的:

$(‘#entryform input).bind(’focus‘, function(){

$(this).addClass(’selected‘);

}).bind(’blur‘, function(){

$(this).removeClass(’selected‘);

});

我们需要在父级监听获取焦点和失去焦点的事件:

$(‘#entryform’).bind(‘focus’, function(e){

var cell = $(e.target); // e.target grabs the node that triggered the event.

cell.addClass(’selected’);

}).bind(‘blur’, function(e){

var cell = $(e.target);

cell.removeClass(’selected’);

});

父级元素扮演了一个调度员的角色, 它可以基于目标元素绑定事件. 如果你发现你给很多元素绑定了同一个事件监听, 那么你肯定哪里做错了.

8.消除无效查询

尽管jquery可以很优雅的处理没有匹配元素的情况, 但它还是需要花费时间去寻找. 如果你整站只有一个全局js, 那么极有可能把所有的jquery函数塞进$(document)ready(function(){//所有你引以为傲的代码})里.

只运行在页面里用到的函数. 大多数有效的方法就是使用行内初始化函数, 这样你的模板就能准确的控制何时何处该执行js.

例如, 你的”文章”页面模板, 你可能会引用如下的代码在body结束处:

<script type=“text/javascript>

mylib.article.init();

</script>

</body>

如果你的页面模板包含一些多变的模块可能不会出现在页面中, 或者为了视觉呈现的原因你需要它们能够快速加载, 你可以将初始化函数紧跟在模块之后.

<ul id=“traffic_light”>

<li><input type=“radio” class=“on” name=“light” value=“red” /> Red</li>

<li><input type=“radio” class=“off” name=“light” value=“yellow” /> Yellow</li>

<li><input type=“radio” class=“off” name=“light” value=“green” /> Green</li>

</ul>

<script type=“text/javascript>

mylib.traffic_light.init();

</script>

你的全局js库可能会是这样子的:

var mylib ={

article_page :{

init : function(){

// Article 特有的jQuery函数.

}

},

traffic_light :{

init : function(){

// Traffic light 特有的jQuery函数.

}

}

}

9. 推迟到 $(window).load

jquery对于开发者来说有一个很诱人的东西, 可以把任何东西挂到$(document).ready下冒充事件. 在大多数例子中你都会发现这样的情况.

尽管$(document).ready确实很有用, 它可以在页面渲染时,其它元素还没下载完成就执行. 如果你发现你的页面一直是载入中的状态, 很有可能就是$(document).ready函数引起的.

你可以通过将jquery函数绑定到$(window).load 事件的方法来减少页面载入时的cpu使用率. 它会在所有的html(包括<iframe>)被下载完成后执行.

$(window).load(function(){

// 页面完全载入后才初始化的jQuery函数.

});

多余的功能例如拖放, 视觉特效和动画, 预载入隐藏图像,等等. 都是适合这种技术的场合.

10. 压缩js

推荐一个js在线压缩地址: http://dean.edwards.name/packer/

11. 全面掌握jquery库

知己知彼, 百战百胜.  只有更深入的了解jQuery才能更灵活的使用它.  这里提供一个jQuery的速查手册, 可以打印出来随身携带.  要是有能力将jQuery源码通读一遍那就更好了.

标签: , , 没有评论
1810月/12关

10款好用的快速在线web开发工具

发布在 邵珠庆

 

这篇文章提供的10个快速在线网页开发工具可以为你在时间十分紧迫之际解决燃眉之急。这类工具的优点在于界面非常直观，操作简单快速，利用它们你可以做的事情包括：网页条纹，背景图案，网站Logo制作，字体样式，文本编辑，图像转换，取色器，等等，就算你不熟悉专业的应用程序如Dreamweaver之类，你也可以相当快速地完成操作。

1. Stripe Generator

这是我比较喜欢使用的网页条纹生成工具，可以制作完全个性化的渐隐渐显条形图案。

stripegen

2. BgPatterns

类似于上面的条纹生成器，利用预设图片或者背景条纹可制作漂亮的重复图形背景。

bgpattenrs

3. Creatr

我不怎么喜欢此类工具，但是有时没有其它选择，我又需要创建‘Web 2.0′ logo，这个工具似乎是不二选择。

creatr

4. Image Tool

又一个免费的Web 2.0 Logo制作工具。

imagetool

5. Typetester

需要快速设置你的字体? Typetester是一个很棒的工具，它能够让你按照自己的需要调整字体样式，提供在线预览，满意后可以下载一个样式表。

typetester

6. Editpad

一个轻量级的在线文本编辑器，可将编辑好的文本下载到本地保存。

Edit Pad Online Text Editor

7. Converticon

一款图片格式转换工具，能够将普通图片转换成ico 或 png的格式，一切操作全部在线完成，推荐使用，建议收藏。

converticon

8. Color Scheme Designer

一款颜色生成工具。

colorscheme

9. Gomockingbird

网页框架生成工具，能够快速生成你想要的网页布局。

wireframe

10. ColourLovers

又一款好用的取色工具，颜色种类非常丰富，可以搜索颜色。

colourlovers

你对网页设计感兴趣吗？如果你喜欢这些在线工具，有新的想法，欢迎发表评论，并将本文分享给你的朋友。

标签: , , 没有评论
1610月/12关

免费 jQuery 交互式图形图表库

发布在 邵珠庆

 

1. The Coolest Calendar

界面非常漂亮的一款日期选择插件，有详细的使用文档，最新版本 1.5。

点击下载    查看示例

2. DatePicker

这款日期插件支持单选、多选和时间区间选择，功能齐全，有 Dialog 和 Flat 两种模式。

点击下载    查看示例

3. Tigra Calendar

Tigra Calendar 是一个跨浏览器的 JavaScript 日历控件，以下拉弹出方式选择日期。

点击下载    查看示例

4. jQuery UI Datepicker

这款日期选择插件属于 jQuery UI 的组件，外观可以利用 jQuery UI 的主题功能定制。

点击下载    查看示例

5. Unobtrusive Date-Picker Widget

支持键盘快捷键，包含 16 种语言的语言包，定制性强。

 

点击下载    查看示例

6. Simple jQuery DatePicker

一款非常简单的 jQuery 日期选择插件，适合作为学习的示例。

点击下载     查看示例

7. YUI Library: Calendar Control

这款插件是 YUI 库的日期选择插件，功能实用。

点击下载    查看示例

8. Date Range Picker

这款插件是对 jQuery UI 日期插件的扩充，支持多种模式的时间区间选择。

点击下载    查看示例

9. jQuery Date Input

另一款基于 jQuery 的日期选择插件，轻量、快速、易用。

点击下载    查看示例

10. Multiday Calendar Datepicker

基于 jQuery 编写的时间区间选择插件，功能简单使用。

下载 JS 文件和 CSS 文件    查看示例

11. Calendar for Mootools

Calendar 是一个 Mootools 库的日期选择插件，定制性很强，代码托管在 Github 上面。

点击下载    查看示例

12. jQuery Date Input

基于 jQuery UI 的日期选择插件，支持日期和时间（时分秒）选择。

点击下载    查看示例

标签: , , , , 3 评论
1610月/12关

梦想天空 jquery 目录

发布在 邵珠庆

精心挑选12款优秀的 JavaScript 日历和时间选择插件
摘要: 今天这篇文章向大家分享12款精心挑选的优秀 JavaScript 日历和时间选择插件，都带有详细的使用教程和效果演示。这些插件能够帮助 Web 开发人员更快速的实现各种精美的日历和时间选择效果。同时推荐阅读的博文中还有更多实现各种网站功能的 jQuery 优秀插件，欢迎大家可以去淘金。阅读全文

posted @ 2012-10-16 09:12 梦想天空（山边小溪） 阅读(388) | 评论 (2) 编辑
推荐六款帮助你实现惊艳视差滚动效果的 jQuery 插件
摘要: 视差（Parallax）是指从不同的点看一个物体时形成的视觉差异，这个名词是源自希腊文的παράλλαξις (parallaxis)，意思是"改变"。在网页设计中，视差滚动（Parallax Scrolling）是当下流行的网页设计技术，通过让多层背景以不同的速度或者不同的方向移动来形成非常有趣的 3D 运动效果。今天这篇文章就和大家分享6款精心挑选的 jQuery 视差滚动效果插件，它们能够帮助你制作出精美的视差滚动效果。阅读全文

posted @ 2012-09-13 09:35 梦想天空（山边小溪） 阅读(4503) | 评论 (17) 编辑
向Web开发人员推荐12款优秀的 Twitter Bootstrap 组件和工具
摘要: Bootstrap 是基于 HTML，CSS，JavaScript 的简洁灵活的流行前端框架及交互组件集，由微博的先驱 Twitter 在2011年8月开源的整套前端解决解决方案。Bootstrap 有非常完备和详尽的开发文档，Web 开发人员能够轻松搭建出清爽风格的界面以及实现良好的交互效果。为了能够充分利用 Bootstrap 的强大功能，下面向打击推荐12款各种各样工具和资源来配合 Bootstrap 使用。阅读全文

posted @ 2012-09-11 14:11 梦想天空（山边小溪） 阅读(4932) | 评论 (44) 编辑
推荐40个简单的 jQuery 导航插件和教程【下篇】
摘要: 导航作为网站重要的组成部分，能够帮助用户找到他们想要的内容，因此导航设计的好坏决定了用户能够在你的网站停留更长的时间，浏览更多的内容。在下面的集 合中，你会发现很多便利的 jQuery 导航插件和有用的教程，帮助你实现充满吸引力的网站导航，让你网站更有组织性和交互性。阅读全文

posted @ 2012-09-11 09:19 梦想天空（山边小溪） 阅读(2065) | 评论 (2) 编辑
推荐40款强大的 jQuery 导航插件和教程【上篇】
摘要: 在这篇文章中，我为大家收集了40款非常棒的 jQuery 导航插件和教程。导航作为网站重要的组成部分，能够帮助用户找到他们想要的内容，因此导航设计的好坏决定了用户能够在你的网站停留更长的时间，浏览更多的 内容。在下面的集合中，你会发现很多便利的 jQuery 导航插件和有用的教程，帮助你实现充满吸引力的网站导航，让你网站更有组织性和交互性。阅读全文

posted @ 2012-09-06 08:46 梦想天空（山边小溪） 阅读(1976) | 评论 (7) 编辑
新鲜出炉的30个精美的 jQuery & CSS3 效果【附演示和教程】
摘要: 作为最流行的 JavaScript 开发框架，jQuery 在现在的 Web 开发项目中扮演着重要角色，它简化了 HTML 文档遍历，事件处理，动画以及 Ajax 交互，帮助 Web 开发人员快速实现可用性和用户体验更佳的功能，让访问者对网站留下非常好的印象。而 CSS3 作为 CSS 的下一个版本，增加了圆角、旋转、阴影等强大的特性，甚至还可以实现需要 JavaScript 才能实现的复杂动画效果。阅读全文

posted @ 2012-09-03 14:51 梦想天空（山边小溪） 阅读(5133) | 评论 (38) 编辑
精心挑选的12款优秀 jQuery 手风琴效果插件和教程
摘要: 当你想在有限的页面空间内展示多个内容片段的时候，手风琴（Accordion）效果就显得非常有用，它可以帮助你以对用户非常友好的方式实现多个内容片 段之间的切换。借助流行的 jQuery 框架，只需很少的代码就可以实现精美的手风琴效果，帮助你的网站吸引更多用户的眼球。阅读全文

posted @ 2012-08-21 14:01 梦想天空（山边小溪） 阅读(4502) | 评论 (18) 编辑
Web前端开发人员和设计师必读文章推荐【系列十】
摘要: 这 篇文章给大家带来最近两个个月发布在《梦想天空》的优秀文章，特别推荐给 Web 开发人员和设计师阅读。梦天空博客关注 前端开发 技术，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的 网页设计 案例，共享精美的 设计素材 和优秀的 Web 开发工具。希望这些文章能帮助到您。阅读全文

posted @ 2012-08-15 09:34 梦想天空（山边小溪） 阅读(10320) | 评论 (34) 编辑
精心挑选的23款美轮美奂的 jQuery 图片特效插件
摘要: jQuery是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择。其中，jQuery 最令人印象深刻的应用之一就是对图片的处理，它可以让帮助你在你的项目中加入各种精美的图片展示效果。下面向大家分享精心挑选的23款优秀 jQuery 图片特效插件，带给你美轮美奂的图片展示效果。阅读全文

posted @ 2012-08-13 09:24 梦想天空（山边小溪） 阅读(4714) | 评论 (13) 编辑
学习 Web 开发技术的16个最佳教程网站和博客
摘要: 互 联网经过这么多年的发展，已经出现了众多的 Web 开发技术，像 .Net/Java/PHP/Python/Ruby 等等。对于 Web 开发人员来说，不管是初学者还是有一定经验的开发人员都需要时刻学习新的开发技术。如今，网上有各种开发技术的相关网站，有大量开发资料可以参考。下面是 我收集的15个非常优秀的学习 Web 开发技术的国外网站，如果大家有收藏更好的网站，欢迎推荐！阅读全文

posted @ 2012-08-10 09:17 梦想天空（山边小溪） 阅读(8761) | 评论 (54) 编辑
精心挑选的12款优秀 jQuery Ajax 分页插件和教程
摘要: 在 这篇文章中，我为大家收集了12个基于 jQuery 框架的 Ajax 分页插件，这些插件都提供了详细的使用教程和演示。Ajax 技术的出现使得 Web 项目的用户体验有了极大的提高，如今借助优秀的 jQuery 框架很容易实现各种基于 Ajax 技术实现的功能。我们一起来看看下面这些优秀的分页插件。阅读全文

posted @ 2012-08-08 13:26 梦想天空（山边小溪） 阅读(6748) | 评论 (50) 编辑
精心挑选的15款优秀 jQuery 文本特效插件和教程
摘要: 今天这篇文章向大家分享15款精心挑选的优秀 jQuery 文本特效插件，都带有详细的使用教程。jQuery 是最流行和使用最广泛的 JavaScript 框架，它简化了HTML文档遍历，事件处理，动画以及Ajax交互，帮助Web开发人员更快速的实现各种精美的界面效果。阅读全文

posted @ 2012-08-06 14:02 梦想天空（山边小溪） 阅读(3190) | 评论 (45) 编辑
优秀的响应式 jQuery 滑块插件 – iView Slider
摘要: iView Slider 是一款优秀的 jQuery 滑动插件，用于实现文本、图片、视频等各种网页内容的滑动功能。iView Slider 支持响应式布局，能够很好的运行于触屏设备中。iView Slider 内置35种很炫的过渡效果（Transition Effects），能够帮助你制作出各种各样的滑动效果。阅读全文

posted @ 2012-07-31 09:02 梦想天空（山边小溪） 阅读(2899) | 评论 (10) 编辑
40个非常实用的 jQuery 插件和免费教程【下篇】
摘要: 作为最流行的 JavaScript 库，jQuery 拥有丰富的插件，能够帮助开发者简单快速的实现各种功能。但对于 Web 开发人员来说，他们需要掌握编写插件的方法，这样在工作中才能游刃有余。今天这篇文章收集了40个非常棒的 jQuery 插件及其制作教程，这些插件能够为你将来的项目增添各种很炫功能和效果，同时通过详细的制作教程帮助你更加深入的掌握 jQuery 库的使用。阅读全文

posted @ 2012-07-26 08:46 梦想天空（山边小溪） 阅读(3411) | 评论 (7) 编辑
40个新鲜出炉的 jQuery 插件和免费教程【上篇】
摘要: 作为最流行的 JavaScript 库，jQuery 拥有丰富的插件，能够帮助开发者简单快速的实现各种功能。但对于 Web 开发人员来说，他们需要掌握编写插件的方法，这样在工作中才能游刃有余。今天这篇文章收集了40个非常棒的 jQuery 插件及其制作教程，这些插件能够为你将来的项目增添各种很炫功能和效果，同时通过详细的制作教程帮助你更加深入的掌握 jQuery 库的使用。阅读全文

posted @ 2012-07-23 08:54 梦想天空（山边小溪） 阅读(5448) | 评论 (25) 编辑
最佳6款用于移动网站开发的 jQuery 图片滑块插件
摘要: 随着智能手机的普及，越来越多的用户开始在手机中浏览网页。今天这篇文章为大家推荐最佳6款用于移动应用的 jQuery 图片滑块插件，这些插件很好的处理了触屏事件，效果平滑，帮助你构建用户体验良好的移动网站。阅读全文

posted @ 2012-07-18 08:50 梦想天空（山边小溪） 阅读(3847) | 评论 (8) 编辑
推荐20款非常优秀的 jQuery 工具提示插件
摘要: 工具提示（Tooltip）在网站中的一个小功能，但却有很重要的作用，常用于显示一些温馨的提示信息。如果网站中的工具提示功能做得非常有创意的话能够 加深用户对网站印象。因此，今天这篇文章收集的20款时尚的 jQuery Tooltip 插件就是用于帮助你制作漂亮的工具提示效果。阅读全文

posted @ 2012-07-14 23:55 梦想天空（山边小溪） 阅读(3808) | 评论 (0) 编辑
Web前端开发人员和设计师必读文章推荐【系列九】
摘要: 这 篇文章主要收录了最近两个个月发布在梦想天空的优秀文章，特别推荐给Web开发人员和设计师阅读。梦天空博客关注 前端开发 技术，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的网页设计案例，共享精美的设计素材和优秀的 Web 开发工具。希望这些文章能帮助到您。阅读全文

posted @ 2012-06-19 09:02 梦想天空（山边小溪） 阅读(8583) | 评论 (28) 编辑
15个精心挑选的 jQuery 下拉菜单制作教程
摘要: 下拉菜单是网站导航常用的表现形式之一，能够呈现更多的导航内容。如果网站能够设计出有吸引力的网站导航，将会吸引更多的用户去浏览网站的内容。今天本文就为大家挑选了25个非常好的 jQuery 下拉菜单制作教程和示例。阅读全文

posted @ 2012-06-15 08:05 梦想天空（山边小溪） 阅读(5397) | 评论 (9) 编辑
帮助你构建自适应布局的30款优秀 jQuery 插件（下篇）
摘要: 自适应设计（Responsive Layouts）是时下网页设计领域最热门的话题之一，自适应设计的目标是要让产品界面能够响应用户的行为，根据不同终端设备自动调整尺寸，带给用户良好 的使用体验。下面是收集的15款优秀的自适应 jQuery 插件，希望这些插件能够帮助到您。阅读全文

posted @ 2012-06-07 08:20 梦想天空（山边小溪） 阅读(4424) | 评论 (3) 编辑
帮助你构建自适应布局的30款优秀 jQuery 插件（上篇）
摘要: 自适应设计（Responsive Layouts）是时下网页设计领域最热门的话题之一，自适应设计的目标是要让产品界面能够响应用户的行为，根据不同终端设备自动调整尺寸，带给用户良好 的使用体验。下面是收集的15款优秀的自适应 jQuery 插件，希望这些插件能够帮助到您。阅读全文

posted @ 2012-06-04 09:14 梦想天空（山边小溪） 阅读(6581) | 评论 (17) 编辑
jQuery Tools：Web开发必备的 jQuery UI 库
摘要: jQuery Tools 是基于 jQuery 开发的网站界面库，包含网站最常用的Tabs（选项卡）、Tooltip（信息提示）、Overlay（遮罩、弹窗）、Scrollable（滚动控 制）、Form Validator（表单验证）、Rangeinput（范围输入）、Dateinput（日期选择）等众多功能。jQuery Tools 提供了高自定义的API接口，能够帮助开发者非常容易的实现所需要的功能，带给用户更佳的使用体验。阅读全文

posted @ 2012-05-21 09:02 梦想天空（山边小溪） 阅读(18088) | 评论 (69) 编辑
10个让人印象深刻的 jQuery 手风琴效果应用
摘要: jQuery 是最流行的 JavaScript 开发框架，它简化了 HTML 文档遍历，事件处理，动画以及 Ajax 交互，帮助 Web 开发人员更快速的实现各种精美的界面效果。今天这篇文章向大家展示10个非常酷的应用 jQuery 手风琴（according）效果网站，一起欣赏。阅读全文

posted @ 2012-05-08 09:02 梦想天空（山边小溪） 阅读(4385) | 评论 (7) 编辑
推荐12款非常有用的流行 jQuery 插件
摘要: jQuery 是一个非常优秀的 JavaScript 框架，在现在的 Web 开发项目中扮演着重要角色。jQuery 使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果，让网站有更好的可用性和用户体验。今天这篇文章向大家推荐 12款个实用的 jQuery 插件。阅读全文

posted @ 2012-04-19 09:47 梦想天空（山边小溪） 阅读(5034) | 评论 (6) 编辑
Web前端开发人员和设计师必读文章推荐【系列八】
摘要: 这篇文章主要收录了最近三个月发布在梦想天空的优秀文章，特别推荐给Web开发人员和设计师阅读。梦天空博客关注前端开发技术，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的网页设计案例，共享精美的设计素材和优秀的 Web 开发工具。希望这些文章能帮助到您。阅读全文

posted @ 2012-04-09 09:04 梦想天空（山边小溪） 阅读(4655) | 评论 (7) 编辑
推荐30个新鲜出炉的精美 jQuery 效果
摘要: jQuery 是最流行和使用最广泛的 JavaScript 框架，它简化了HTML文档遍历，事件处理，动画以及Ajax交互，帮助Web开发人员更快速的实现各种精美的界面效果。jQuery 的易扩展性吸引了来自全球的开发者来共同编写 jQuery 插件，这些优秀的 jQuery 插件不仅能够增强网站的可用性，有效的改善用户体验，还可以大大减少开发时间。阅读全文

posted @ 2012-03-26 09:10 梦想天空（山边小溪） 阅读(7381) | 评论 (24) 编辑
8款非常棒的响应式 jQuery 幻灯片插件推荐
摘要: 这篇文章收集了8款优秀的响应式 jQuery 幻灯片插件，它们能够非常容易的集成到Web项目中。响应式（Responsive）设计的目标是要让产品界面能够响应用户的行为，根据不同终端设备自动调整尺寸，带给用户良好的使用体验。阅读全文

posted @ 2012-01-31 08:51 梦想天空（山边小溪） 阅读(5457) | 评论 (12) 编辑
Web前端开发人员和设计师必读文章推荐【系列七】
摘要: 这 篇文章主要收录了十二月份发布在梦想天空的优秀文章，特别推荐给Web开发人员和设计师阅读。梦天空博客关注前端开发技术，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的网页设计案例，共享精美的设计素材和优秀的 Web 开发工具。希望这些文章能帮助到您。阅读全文

posted @ 2012-01-05 09:00 梦想天空（山边小溪） 阅读(14967) | 评论 (14) 编辑
40款非常实用的 jQuery 插件推荐（系列三）
摘要: jQuery 是一个非常优秀的 JavaScript 框架，在现在的 Web 开发项目中扮演着重要角色。jQuery 使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果，让网站有更好的可用性和用户体验。这篇文章是40款非常有用 的 jQuery 插件系列文章最后一篇，希望这些实用的插件能帮助到您。阅读全文

posted @ 2011-12-26 08:55 梦想天空（山边小溪） 阅读(4489) | 评论 (7) 编辑
40款非常有用的 jQuery 插件推荐（系列二）
摘要: jQuery 是一个非常优秀的 JavaScript 框架，在现在的 Web 开发项目中扮演着重要角色。jQuery 使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果，让网站有更好的可用性和用户体验。本文向大家分享40个非常 有用的 jQuery 插件。阅读全文

posted @ 2011-12-23 08:51 梦想天空（山边小溪） 阅读(4365) | 评论 (12) 编辑
40款非常有用的 jQuery 插件推荐（系列一）
摘要: jQuery 是一个非常优秀的 JavaScript 框架，在现在的 Web 开发项目中扮演着重要角色。jQuery 使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果，让网站有更好的可用性和用户体验。本文向大家分享40个非常 有用的 jQuery 插件。阅读全文

posted @ 2011-12-20 09:10 梦想天空（山边小溪） 阅读(6177) | 评论 (8) 编辑
8个很棒的 jQuery 倒计时插件和教程
摘要: jQuery 是最流行也是使用最广泛的 JavaScript 框架，它简化了 HTML 文档操作，事件处理，动画效果和 Ajax 交互。下面向大家分享8个优秀的 jQuery 倒计时插件和教程。阅读全文

posted @ 2011-12-12 10:13 梦想天空（山边小溪） 阅读(2543) | 评论 (0) 编辑
Web前端开发人员和设计师必读文章推荐【系列六】
摘要: 这 篇文章收录了十一月份发布在梦想天空博客的优秀文章，特别推荐给Web开发人员和设计师阅读。梦天空博客关注前端开发技术，展示最新HTML5和CSS3 技术应用，分享实用的jQuery插件，推荐优秀的网页设计案例，共享精美的设计素材和优秀的Web开发工具。希望这些文章能帮助到您。阅读全文

posted @ 2011-12-06 09:00 梦想天空（山边小溪） 阅读(5549) | 评论 (9) 编辑
让人期待的2011年度最佳 jQuery 插件发布啦
摘要: 近日，国外著名博客WDL发布了2011年度最佳 jQuery 插件。jQuery 自2006年发布以来，经过五年的迅速发展，目前已是最流行和使用最广泛的 JavaScript 框架。jQuery 的易扩展性吸引了来自全球的开发者来共同编写 jQuery 插件，jQuery 插件不仅能够增强网站的可用性，有效的改善用户体验，还可以大大减少开发时间。阅读全文

posted @ 2011-11-25 08:45 梦想天空（山边小溪） 阅读(15385) | 评论 (34) 编辑
15个款优秀的 jQuery 图片特效插件推荐
摘要: 这篇文章向大家推荐15个最佳 jQuery 图片效果插件。jQuery是最流行的Javascript框架，使用简单灵活，同时还有许多成熟的插件可供选择。其中，jQuery 最令人印象深刻的应用之一就是对图片的处理，它可以让帮助你在你的项目中加入一些让人惊叹的图片效果。阅读全文

posted @ 2011-11-20 00:30 梦想天空（山边小溪） 阅读(7188) | 评论 (2) 编辑
20款效果非常棒的 jQuery 插件分享
摘要: 这篇文章向大家推荐20款效果非常棒的jQuery插件。jQuery是一个非常优秀的JavaScript库，它简化了HTML文档遍历，事件处理，动 画以及Ajax交互，改变了很多人写JavaScript的方式。如今，网上有很多优秀的jQuery插件可免费使用，它们能够帮助你在网站中加入漂亮的 效果。看看下面这些非常棒的jQuery插件，相信你会发现一些很有用的东西。阅读全文

posted @ 2011-11-18 13:36 梦想天空（山边小溪） 阅读(3656) | 评论 (6) 编辑
40款非常棒的 jQuery 插件和制作教程【系列四】
摘要: 在所有的 JavaScript 框架中，jQuery 是最流行也是使用最广泛的，它简化了 HTML 文档操作，事件处理，动画和 Ajax 交互。下面向大家分享优秀的 jQuery 插件，同时有效果演示以及详细的插件制作教程，希望能帮助到您。阅读全文

posted @ 2011-11-16 09:07 梦想天空（山边小溪） 阅读(3635) | 评论 (2) 编辑
Web开发人员和设计师必读文章推荐【系列五】
摘要: 本 文继续向Web开发人员和设计师推荐优秀文章。梦想天空博客关注前端开发技术，展示最新HTML5和CSS3技术应用，分享实用的jQuery插件，推荐 优秀的网页设计案例，共享精美的设计素材和强大的Web开发工具。本文特别推荐给Web设计师和开发人员阅读，希望这些资源能帮助到您。阅读全文

posted @ 2011-11-11 10:11 梦想天空（山边小溪） 阅读(6918) | 评论 (18) 编辑
推荐40个非常优秀的 jQuery 插件和教程【系列三】
摘要: jQuery 在现在的 Web 开发项目中扮演着重要角色，jQuery 让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。jQuery 以其插件众多、独特、轻量以及支持大规模的网站开发闻名。本文与大家分享40个实用的 jQuery 插件，可以根据您的项目需要来选择使用。阅读全文

posted @ 2011-11-08 09:20 梦想天空（山边小溪） 阅读(3443) | 评论 (12) 编辑
40款非常棒的 jQuery 插件和制作教程（系列二）
摘要: jQuery 在现在的 Web 开发项目中扮演着重要角色，jQuery 让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。jQuery 以其插件众多、独特、轻量以及支持大规模的网站开发闻名。本文与大家分享40个实用的 jQuery 插件，可以根据您的项目需要来选择使用。阅读全文

posted @ 2011-11-02 09:02 梦想天空（山边小溪） 阅读(3217) | 评论 (6) 编辑
40款非常棒的 jQuery 插件和制作教程（系列一）
摘要: jQuery 是一个非常优秀的 JavaScript 框架，在现在的 Web 开发项目中扮演着重要角色。jQuery 使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果，让网站有更好的可用性和用户体验。本文向大家分享40个实用 的 jQuery 插件以及制作教程。阅读全文

posted @ 2011-10-25 08:18 梦想天空（山边小溪） 阅读(7439) | 评论 (39) 编辑
25个强大的 jQuery 砌体网页设计作品
摘要: 砌体（Masonry）是一种网页排布形式，类似于砖砌体、石砌体建造的结构，如下图，左侧是传统的使用CSS浮动实现的布局效果，右图是砌体排布。砌体 布局在不规则的网页内容块布局中非常有用，能够充分利用网页空间，很多网站的照片浏览就采用了砌体形式。今天这篇文章就和大家分享25个基于jQuery 实现的砌体网页设计作品，一起欣赏。阅读全文

posted @ 2011-09-23 00:17 梦想天空（山边小溪） 阅读(5443) | 评论 (10) 编辑
Web前端开发人员和设计师必读文章推荐【系列四】
摘要: 梦想天空博客专注于分享 Web 开发技术、资源和教程，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的网页设计案例，共享精美的设计素材和强大的 Web 开发工具。分享快乐，快乐分享，希望这些资源能帮助到您。阅读全文

posted @ 2011-09-19 09:13 梦想天空（山边小溪） 阅读(4634) | 评论 (8) 编辑
Web前端开发人员和设计师必读文章推荐【系列三】
摘要: 梦想天空博客专注于分享 Web 开发技术、资源和教程，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的网页设计案例，共享精美的设计素材和强大的 Web 开发工具。分享快乐，快乐分享，希望这些资源能帮助到您。阅读全文

posted @ 2011-08-31 08:04 梦想天空（山边小溪） 阅读(4523) | 评论 (15) 编辑
25个非常棒的jQuery滑块插件和教程
摘要: 滑块和幻灯片效果，已成为网页设计的流行要素，它们以更加有趣的方式呈现内容，同时能节省网页空间。如果你想知道这是如何实现的，那么本文收集的25个非常棒的 jQuery 滑块插件和制作教程将帮助您实现这种效果。阅读全文

posted @ 2011-08-30 01:02 梦想天空（山边小溪） 阅读(4930) | 评论 (10) 编辑
20个非常棒的 jQuery 幻灯片插件和教程
摘要: jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果。滑块和幻灯片效果是常用的内容展示方式之一，这是一种 在有限的网页空间内展示系列项目时非常好的方法。今天这篇文章就与大家分享20个非常棒的 jQuery 幻灯片插件和教程。阅读全文

posted @ 2011-08-23 09:15 梦想天空（山边小溪） 阅读(3919) | 评论 (2) 编辑
30个精美的jQuery幻灯片效果插件和教程
摘要: 这篇文章与大家分享30个精美的的 jQuery 幻灯片效果插件和教程。您可能经常能看到一些网站上特色区域的内容以滚动方式变化，这是一种在有限的网页空间内展示更多内容的良好方式，而且能吸引用户注 意力。如果你想知道这是如何实现的，那么本文收集的30个幻灯片插件和教程将帮助您实现这种效果。阅读全文

posted @ 2011-08-18 08:49 梦想天空（山边小溪） 阅读(7691) | 评论 (4) 编辑
13个超级有用的 jQuery 内容滚动插件和教程
摘要: 这篇文章与大家分享13个超级有用的 jQuery 内容滚动插件和教程。您可能经常能看到一些网站上特色区域的内容以滚动方式变化，这是一种在有限的网页空间内展示更多内容的良好方式，而且能吸引用户注意 力。如果你一直想知道这是如何实现的，那么这里的13个 jQuery 内容滚动插件教程将帮助您实现这种效果。阅读全文

posted @ 2011-07-29 08:12 梦想天空（山边小溪） 阅读(9653) | 评论 (8) 编辑
推荐5个应用 jQuery 特效的精美网站
摘要: jQuery 在现在的 Web 开发项目中扮演着重要角色，借助 jQuery 可以让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。今天这篇文章向大家分享5个应用 jQuery 的精美网站，一起欣赏。阅读全文

posted @ 2011-07-22 10:28 梦想天空（山边小溪） 阅读(5908) | 评论 (6) 编辑
33个优秀的 jQuery 图片展示插件分享
摘要: 这篇文章收集了33个优秀的 jQuery 图片插件分享给大家。jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择，其中最令人印象深刻的应用之一就是对图片的处理，它可以让帮助你在你的项目中加入一些精美的效果， 给访问者对网站留下非常好的印象。阅读全文

posted @ 2011-07-20 00:01 梦想天空（山边小溪） 阅读(14928) | 评论 (5) 编辑
15款优秀的 jQuery 导航菜单插件
摘要: 这篇文章收集了15款优秀的jQuery导航菜单插件分享给大家。jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择，jQuery 让网站有更好的可用性和用户体验，给访问者对网站留下非常好的印象。阅读全文

posted @ 2011-07-18 12:35 梦想天空（山边小溪） 阅读(3641) | 评论 (2) 编辑
19个非常有用的 jQuery 图片滑动插件和教程
摘要: jQuery 是一个非常优秀的 Javascript 框架，使用简单灵活，同时还有许多成熟的插件可供选择。其中，最令人印象深刻的应用之一就是对图片的处理，它可以让帮助你在你的项目中加入精美的效果。今 天这篇文章向大家分享19个非常有用的 jQuery 图片滑动插件和教程。阅读全文

posted @ 2011-07-15 01:13 梦想天空（山边小溪） 阅读(7766) | 评论 (6) 编辑
Web前端开发人员和设计师必读文章推荐【系列二】
摘要: 梦想天空博客专注于分享 Web 开发技术、资源和教程，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的网页设计案例，共享精美的设计素材和强大的 Web 开发工具。分享快乐，快乐分享，希望这些资源能帮助到您。阅读全文

posted @ 2011-07-13 08:06 梦想天空（山边小溪） 阅读(7394) | 评论 (28) 编辑
分享33个优秀的 jQuery 教程
摘要: jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，在现在的Web开发项目中扮演着重要角色。这篇文章与大家分享33个优秀的 jQuery 教程，教您如何使用 jQuery 制作幻灯片、动画菜单、照片墙、图片画廊等很多效果很炫的功能。阅读全文

posted @ 2011-07-06 09:05 梦想天空（山边小溪） 阅读(5585) | 评论 (32) 编辑
分享50款非常棒的 jQuery 插件（下篇）
摘要: jQuery 在现在的Web开发项目中扮演着重要角色，jQuery 让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。jQuery 以其插件众多、独特、轻量以及支持大规模的网站开发闻名。本文与大家分享50款非常有用的 jQuery 插件，可以根据您的项目需要来选择使用。阅读全文

posted @ 2011-06-28 08:04 梦想天空（山边小溪） 阅读(3696) | 评论 (14) 编辑
分享50款非常棒的 jQuery 插件（上篇）
摘要: jQuery 在现在的Web开发项目中扮演着重要角色，jQuery 让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。jQuery 以其插件众多、独特、轻量以及支持大规模的网站开发闻名。本文与大家分享50款非常有用的 jQuery 插件，可以根据您的项目需要来选择使用。阅读全文

posted @ 2011-06-23 21:42 梦想天空（山边小溪） 阅读(4586) | 评论 (32) 编辑
Web前端开发人员和设计师必读文章推荐【系列一】
摘要: 梦想天空博客专注于分享 Web 开发技术、资源和教程，展示最新 HTML5 和 CSS3 技术应用，分享实用的 jQuery 插件，推荐优秀的网页设计案例，共享精美的设计素材和强大的 Web 开发工具。分享快乐，快乐分享，希望这些资源能帮助到您。阅读全文

posted @ 2011-06-20 00:11 梦想天空（山边小溪） 阅读(12354) | 评论 (33) 编辑
10款非常棒的 jQuery 幻灯片插件
摘要: 这篇文章与大家分享的是10款非常棒的 jQuery 幻灯片插件，使用这些插件可以帮助你在网站中加入非常吸引人的幻灯片效果，另外这些插件还有制作教程。阅读全文

posted @ 2011-06-12 11:52 梦想天空（山边小溪） 阅读(2206) | 评论 (10) 编辑
分享最新十个流行的 jQuery 插件
摘要: 这篇文章与大家分享的是10款最新收集的 jQuery 插件，有文本效果，地图，表单和表格等等。这些作者的想法特别新颖，希望你能从中找到自己需要的插件。阅读全文

posted @ 2011-06-11 12:25 梦想天空（山边小溪） 阅读(2811) | 评论 (6) 编辑
推荐10款非常有用的 Ajax 插件
摘要: 这篇文章与大家分享的是10款非常有用的 Ajax 插件，有用于图片的，用于分页的，还有用于导航的。这些作者的想法特别新颖，希望你能从中找到自己需要的插件。阅读全文

posted @ 2011-06-10 09:10 梦想天空（山边小溪） 阅读(4291) | 评论 (17) 编辑
20个最让人期待的 jQuery 相册插件
摘要: jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择。其中，jQuery 最令人印象深刻的应用之一就是对图片的处理，它可以帮助你在网站中加入一些很酷的效果。今天，本文收集了20个最让人期待的 jQuery 相册插件分享给大家，记得分享和推荐一下 🙂阅读全文

posted @ 2011-06-08 08:53 梦想天空（山边小溪） 阅读(14354) | 评论 (14) 编辑
10款新鲜出炉的 jQuery 插件
摘要: 这篇文章与大家分享的是10款新鲜出炉的基于 jQuery 开发的 Ajax 插件，有幻灯片、图片画廊、菜单等很多有用的插件。这些作者的想法特别新颖，希望你能从中找到自己需要的插件。阅读全文

posted @ 2011-06-06 09:12 梦想天空（山边小溪） 阅读(3398) | 评论 (12) 编辑
18个使用 jQuery 制作的创意网站欣赏
摘要: jQuery 是一个非常优秀的 Javascript 框架，在现在的 Web 开发项目中扮演着重要角色，借助 jQuery 可以让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。今天这篇文章与大家分享18个使用 jQuery 制作的创意网站，一起欣赏。阅读全文

posted @ 2011-06-04 01:36 梦想天空（山边小溪） 阅读(2902) | 评论 (2) 编辑
60款很酷的 jQuery 幻灯片演示和下载
摘要: jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入漂亮的效果，其中之一就是幻灯片效果的实现，这是一种在有限的网页空间内 展示系列项目时非常好的方法。今天这篇文章要给大家分享的是60款很酷的 jQuery 幻灯片插件，相信里面一定会有你喜欢的。阅读全文

posted @ 2011-05-31 08:09 梦想天空（山边小溪） 阅读(77634) | 评论 (145) 编辑
最新28个很棒的 jQuery 教程
摘要: jQuery是一个非常优秀的Javascript框架，使用简单灵活，同时还有许多成熟的插件可供选择。今天，这篇文章收集了最新28个非常有用的 jQuery 教程分享给大家。阅读全文

posted @ 2011-05-27 08:18 梦想天空（山边小溪） 阅读(12919) | 评论 (51) 编辑
分享9个实用的 jQuery 倒计时插件
摘要: jQuery在现在的Web开发项目中扮演着重要角色，jQuery让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。jQuery以其 插件众多、独特、轻量以及支持大规模的网站开发闻名。本文与大家分享9个实用的jQuery倒计时脚本，可以根据您的项目需要来选择使用。阅读全文

posted @ 2011-05-22 00:53 梦想天空（山边小溪） 阅读(3119) | 评论 (4) 编辑
非常流行的十款 jQuery 插件推荐
摘要: 本文列举了10款最流行的 jQuery 插件，有验证用户输入的，有以真正用户友好的方式显示多媒体和图像的，有使数据以可视化的图形和图表的形式展示的等等。相信这十大流行的 jQuery 插件将有助于你的开发项目。阅读全文

posted @ 2011-05-20 09:31 梦想天空（山边小溪） 阅读(4342) | 评论 (7) 编辑
分享13款非常有用的 jQuery 插件
摘要: jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果。这篇文章与大家分享13款非常有用的 jQuery 插件。阅读全文

posted @ 2011-05-14 07:18 梦想天空（山边小溪） 阅读(3523) | 评论 (6) 编辑
为你的网站增加亮点的9款 jQuery 插件推荐
摘要: 如今，jQuery插件众多，满足各种各样的应用需求。 在这篇文章中，我收集了9款很棒的插件，最喜欢的是Sausage内容分页插件，作者想法特别新颖！希望你能从中找到自己需要的插件。阅读全文

posted @ 2011-05-03 09:26 梦想天空（山边小溪） 阅读(15239) | 评论 (24) 编辑
12个很棒的学习 jQuery 的网站推荐
摘要: jQuery是目前最流行的 JavaScript 库。对于初学者来说，有的时候很难找到一个好的学习jQuery的网站，今天本文收集了12个很棒的 jQuery 学习网站推荐给大家。阅读全文

posted @ 2011-04-28 00:03 梦想天空（山边小溪） 阅读(9954) | 评论 (14) 编辑
提升你网站水平的 jQuery 插件推荐
摘要: jQuery 是一个优秀JavaScript库，它简化了HTML文档遍历，事件处理，动画和Ajax交互。 jQuery的确改变了很多人写JavaScript的方式。如今，有很多现成的jQuery插件可供选择，帮助你在网站中加入惊人的功能和效果。看看这 些非常棒的jQuery插件吧，我相信你会发现一些很有用的东西。阅读全文

posted @ 2011-04-19 00:12 梦想天空（山边小溪） 阅读(16818) | 评论 (46) 编辑
分享20佳好玩的 jQuery 游戏
摘要: jQuery是时下最流行的 JavaScript 库。现在，除了HTML5以外，也有很多jQuery爱好者使用jQuery来开发游戏，虽然效果没有Flash那么好，但是这些游戏也看起来很酷。今天 本文收集了20佳基于jQuery开发的特色游戏，一起来欣赏吧！阅读全文

posted @ 2011-04-17 00:16 梦想天空（山边小溪） 阅读(2902) | 评论 (6) 编辑
分享10篇优秀的 jQuery 幻灯片制作教程及应用案例
摘要: jQuery 是一个非常优秀的 JavaScript 框架，使用简单灵活，同时还有许多成熟的插件可供选择，它可以帮助你在项目中加入一些非常好的效果。幻灯片效果是常用的内容展示方式之一，这是一种在有限 的网页空间内展示系列项目时非常好的方法。今天给大家分享的是10篇非常棒的 jQuery 幻灯片教程及16个优秀的 jQuery 幻灯片应用案例。阅读全文

posted @ 2011-04-15 00:06 梦想天空（山边小溪） 阅读(3830) | 评论 (10) 编辑
分享30个最佳 jQuery Lightbox 效果插件
摘要: Lightbox 应该是最流行的图片浏览效果了，常具有功能包括：自动根据窗口的大小缩放图片，模式窗口，幻灯片方式播放，内容预加载，渐变等效果。Web开发者们模仿 Lightbox 开发了各种各样的图片浏览插件，有基于 jQuery 的，有基于 Prototype 的，也有使用原生 JavaScript 写的。今天，本文要与大家分享的是30个最佳 jQuery Lightbox 效果插件。阅读全文

posted @ 2011-04-11 08:25 梦想天空（山边小溪） 阅读(26758) | 评论 (29) 编辑
分享18个非常棒的 jQuery 表格插件
摘要: 我们一般都是用HTML表格来显示结构化数据，如今有很多的 jQuery 表格插件可以帮助我们更好的组织和控制表格数据，增强表格的功能和操作。今天要与大家分享的是18个非常优秀的 jQuery 表格插件，有用到朋友可以参考一下。阅读全文

posted @ 2011-04-10 11:44 梦想天空（山边小溪） 阅读(7415) | 评论 (14) 编辑
分享24款非常有用的 jQuery 插件
摘要: jQuery 在现在的Web开发项目中扮演着重要角色，jQuery 让网站有更好的可用性和用户体验，让访问者对网站留下非常好的印象。jQuery 以其插件众多、独特、轻量以及支持大规模的网站开发闻名。本文与大家分享24款非常有用的 jQuery 插件，可以根据您的项目需要来选择使用。阅读全文

posted @ 2011-04-06 00:11 梦想天空（山边小溪） 阅读(4117) | 评论 (12) 编辑
推荐8个超棒的学习 jQuery 的网站
摘要: 根据国外科技网站 W3Techs 一项调查了近100万个网站数据显示，jQuery是目前最流行的 JavaScript 库。对于初学者来说，有的时候很难找到一个好的学习jQuery的网站，所以本文收集了8个很棒的 jQuery 学习网站推荐给大家。阅读全文

posted @ 2011-03-31 00:28 梦想天空（山边小溪） 阅读(6781) | 评论 (36) 编辑
分享27款非常棒的 jQuery 表单插件
摘要: jQuery的易扩展性吸引了来自全球的开发者来共同编写jQuery插件。jQuery插件不仅能够增强网站的可用性，有效地改善用户体验，还可以大大减少开发时间。本文收集了非常棒的jQuery表单插件与大家分享，欢迎大家推荐更多更好的插件。阅读全文

posted @ 2011-03-24 00:10 梦想天空（山边小溪） 阅读(11839) | 评论 (26) 编辑
Web开发者必备的20款超赞jQuery插件
摘要: jQuery的易扩展性吸引了来自全球的开发者来共同编写jQuery插件。jQuery插件不仅能够增强网站的可用性，有效地改善用户体验，还可以大大减少开发时间。现在的jQuery插件很多，可以根据您的项目需要来选择。这里为您介绍20款非常不错的插件。 阅读全文

posted @ 2011-02-16 23:59 梦想天空（山边小溪） 阅读(33323) | 评论 (65) 编辑
推荐10个非常有用的jQuery图片插件
摘要: Jquery是一个非常优秀的Javascrīpt框架，使用简单灵活，同时还有许多成熟的插件可供选择。其中，最令人印象深刻的应用之一就是对图片的处理，它可以让你在你的项目中加入一些让人惊叹的效果。这里收集了10个jQuery插件与大家分享。阅读全文

posted @ 2011-01-21 00:43 梦想天空（山边小溪） 阅读(6639) | 评论 (5) 编辑
Web开发者必备的12款超赞jQuery插件
摘要: jQuery插件能够增强网站的可用性，有效地改善用户体验，还可以大大减少创建一个新站点的开发时间。现在的jQuery插件很多，尽可以根据您的项目 要求来选择，不过也有一些插件很好用，几乎各种项目都能够用得上。这里就为您介绍12款开发中最常用的jQuery插件。阅读全文

posted @ 2010-12-19 22:43 梦想天空（山边小溪） 阅读(1114) | 评论 (0) 编辑
直逼 Flash 的流畅感：jQuery 运动特效展示
摘要: 目前，围剿 Flash 的不仅有 HTML 5，还有 JavaScript，著名的 JavaScript 框架 jQuery 在运动特效方面已经越来越流畅，有时候你需要点一下右键来确认它不是 Flash。本文介绍了10个非常出色的 jQuery 运动特效，这些效果可以更有效地展示你的内容。1. 流感导航菜单下面的导航菜单，当鼠标在上面移动的时候，会很流畅地垂下解释菜单，当你将鼠标在上面快速左右移动的时候，会怀疑这是 Flash。2. 转花灯Roundabout 是一个 jQuery 插件，可以将一组 HTML 对象转换为旋转花灯的效果。3. 拉洋片拉洋片也许是 jQuery 最拿手的效果了。该阅读全文

posted @ 2010-03-29 20:12 梦想天空（山边小溪） 阅读(911) | 评论 (0) 编辑
2009 年度最佳 jQuery 插件
摘要: jQuery 是个宝库，而 jQuery 的插件体系是个取之不竭的宝库，众多开发者在 jQuery 框架下，设计了数不清的插件，jQuery 的特长是网页效果，因此，它的插件库也多与 UI 有关。本文是 webdesignledger.com 网站推选的2009年度最佳 jQuery 插件。一、拉洋片在一个固定区域，循环显示几段内容，这种方式很像旧时的拉洋片，2009年，这种 Web 效果大行其道，jQuery 有大量与此有关的插件，以下插件无疑是最佳的。AnythingSlider 由 CSS-Tricks 的 Chris Coyier 设计，功能齐全，应用十分广泛。Easy Slider这阅读全文

posted @ 2010-01-15 13:28 梦想天空（山边小溪） 阅读(707) | 评论 (0) 编辑
【转】将 jQuery IntelliSense整合到Visual Studio方法
摘要: 上个月，我在博客里宣布了微软将对jQuery提供支持。在过去的几个星期里，我们与jQuery开发团队合作，在Studio 2008 和 Visual Web Developer 2008 Express版本（免费的）中增加了很好的jQuery intellisense支持。现在这个支持可以下载使用了。在VS 2008中启用jQuery Intellisense的步骤要在VS中启用jQuery的intellisense完成，你要遵循三个步骤：第一步： 安装VS 2008 SP1VS 2008 SP1 在Visual Studio中加了更丰富的JavaScript intellisense支持，对阅读全文

posted @ 2009-04-27 00:15 梦想天空（山边小溪） 阅读(430) | 评论 (2) 编辑
标签: 没有评论
 « 上一页  下一页

支持博主

关于邵珠庆博客

文章标签

API GA Git Google Analytics HTML5 jquery JS Linux MySQL nginx PHP SaaS web 互联网 代码 使用 分析 创业 原理 命令 好东西 如何 工具 常用 开发 总结 技巧 技术 插件 数据 文件 方法 时间 架构 框架 汇总 百度 管理 系统 网站 网站分析 设计 详解 问题 阿里云

记事邵珠庆博客

1、Web前端网址导航
2、邵珠庆极客筛站
3、识别移动设备访问代码

竹磬网-了解慈善捐款计划

最近文章

最近评论

博客日历

2025年10月
一 二 三 四 五 六 日
« 8月    
 12345
6789101112
13141516171819
20212223242526
2728293031  

目录分类

文章归档

博客功能

京东好物