طراحی صفحه خطای sky drive حرکت ماهی توی امواج دریا حرکت ابر و بال زدن کبوتر

[habibb]

http://barnamenevis.org/attachment.php?attachmentid=127723&d=1421692175

می خواستم
این لینک (http://sdrv.ms/456346346)
رو طراحی کنم.
نمی دونم اسکریپتش کدومه و چه جور تاثیر می گذاره؟ دیوی با آیدی ripple-control وقتی موس هاور میشه روش باعث حرکت امواج و ماهی میشه.
کمی در مورد تحلیل کد اسکریپتش؟

http://barnamenevis.org/attachment.php?attachmentid=127724&d=1421692206


همینطور در مورد حرکت ابرها وبال زدن کبوتر.

http://barnamenevis.org/attachment.php?attachmentid=127722&d=1421692141
در ضمن لینک سازندش (http://www.johnpezzetti.com/2011/01/25/html5-canvas-tutorial-creating-a-2-dimensional-wave) John Pezzetti اینجاست.
http://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/BezierCurve.gif/240px-BezierCurve.gif
http://upload.wikimedia.org/wikipedia/commons/thumb/d/db/B%C3%A9zier_3_big.gif/240px-B%C3%A9zier_3_big.gif
http://upload.wikimedia.org/wikipedia/commons/thumb/3/3d/B%C3%A9zier_2_big.gif/240px-B%C3%A9zier_2_big.gif
http://upload.wikimedia.org/wikipedia/commons/a/a4/B%C3%A9zier_4_big.gif



مقالات ----------------------------------------------------------------------------------------------------------------------
دانلود و نصب ویزیویگ CKEditor و CKFinder برای ASP.NET (فعال نمودن آپلود عکس) (http://barnamenevis.org/showthread.php?478188-%D8%AF%D8%A7%D9%86%D9%84%D9%88%D8%AF-%D9%88-%D9%86%D8%B5%D8%A8-%D9%88%DB%8C%D8%B2%DB%8C%D9%88%DB%8C%DA%AF-CKEditor-%D9%88-CKFinder-%D8%A8%D8%B1%D8%A7%DB%8C-ASP-NET-(%D9%81%D8%B9%D8%A7%D9%84-%D9%86%D9%85%D9%88%D8%AF%D9%86-%D8%A2%D9%BE%D9%84%D9%88%D8%AF-%D8%B9%DA%A9%D8%B3))

چطور اضافه کردن ویژگی SyntaxHighLighting در CKEditor برای ASP.NET با Syntaxhighlighter Interface (http://barnamenevis.org/showthread.php?478260-%DA%86%D8%B7%D9%88%D8%B1-%D8%A7%D8%B6%D8%A7%D9%81%D9%87-%DA%A9%D8%B1%D8%AF%D9%86-%D9%88%DB%8C%DA%98%DA%AF%DB%8C-SyntaxHighLighting-%D8%AF%D8%B1-CKEditor-%D8%A8%D8%B1%D8%A7%DB%8C-ASP-NET-%D8%A8%D8%A7-Syntaxhighlighter-Interface)
از طرف حرکت جوهری (http://substantialmotion.ir/)

[habibb]

HTKL5 Canvas ایجاد موج دو بعدی

http://www.johnpezzetti.com/wp/wp-content/uploads/2011/01/ripple_demo_1.jpg

http://www.johnpezzetti.com/wp/wp-content/uploads/2011/01/ripple_demo_2.jpg


function drawShape(){

midPointY = Math.sin(counter*10*C)*((dur-counter)*ampMultiplier); //Calculates the y value of the midpoint

if (counter <= dur){
points[midPointIndex] = new Array(0,midPointY);

//Check if counter has reached 90deg or 270deg, if so, time to spawn another point
if (counter%9 == 0 && counter%2 == 1){
points[point] = Array(-1,midPointY);
point++;
}
}

ctx.clearRect(0,0,canvas.width,canvas.height); //Clear the canvas

ctx.beginPath();
ctx.moveTo(0, waterLevel); //Start on the left side

//Will contain the previous point to help each point set its bezier curve
var lastPoint = new Array(0,waterLevel);

//Loop through the array of points
//Calculates the proper x and y values of each point
//Does the actual drawing
for (var pt = 0; pt < totalPoints; pt++){
if (points[pt]){
if (pt < midPointIndex){
points[pt][0] = (points[pt][0]*spreadAccelleration)-spreadSpeed; //Move points away from the center point
points[(midPointIndex-pt)+midPointIndex] = new Array(-points[pt][0],points[pt][1]); //Create an opposite point
}

var x = points[pt][0]+midPointX;
var y = points[pt][1]+waterLevel;

var bezHandle1 = ((x-lastPoint[0])/2)+lastPoint[0];
var bezHandle2 = x-((x-lastPoint[0])/2);
ctx.bezierCurveTo(bezHandle1, lastPoint[1], bezHandle2, y, x, y);

lastPoint[0] = x;
lastPoint[1] = y;
}
};

//The Water Level has been rendered, draw the rest of the container
ctx.lineTo(cWidth, waterLevel);
ctx.lineTo(cWidth, 0);
ctx.lineTo(0,0);
ctx.closePath();

ctx.fill();

counter++;
if ( counter == dur) animationActive = false;
if (counter >= (dur*2)) stopAni();

}