diff options
author | Florian Merz <me@fiji-flo.de> | 2021-02-11 14:47:01 +0100 |
---|---|---|
committer | Florian Merz <me@fiji-flo.de> | 2021-02-11 14:47:01 +0100 |
commit | ed2c9751e26d161ad81d86a8d50985cb964d30a1 (patch) | |
tree | dc085d69b56212cd2ff279fcd1188391ce2ae6e3 /files/fa/web | |
parent | 8260a606c143e6b55a467edf017a56bdcd6cba7e (diff) | |
download | translated-content-ed2c9751e26d161ad81d86a8d50985cb964d30a1.tar.gz translated-content-ed2c9751e26d161ad81d86a8d50985cb964d30a1.tar.bz2 translated-content-ed2c9751e26d161ad81d86a8d50985cb964d30a1.zip |
unslug fa: move
Diffstat (limited to 'files/fa/web')
-rw-r--r-- | files/fa/web/api/canvas_api/tutorial/index.html | 180 | ||||
-rw-r--r-- | files/fa/web/api/htmlelement/innertext/index.html (renamed from files/fa/web/api/node/innertext/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/api/server-sent_events/index.html | 99 | ||||
-rw-r--r-- | files/fa/web/css/attribute_selectors/index.html (renamed from files/fa/web/css/انتخابگرـویژگی/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/css/media_queries/using_media_queries/index.html (renamed from files/fa/web/css/media_queries/ابزار-تست-رسانه-پاسخگو/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/css/type_selectors/index.html (renamed from files/fa/web/css/انتخابگرـنوع/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/css/zoom/index.html (renamed from files/fa/web/css/بزرگنمایی/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/guide/html/html5/index.html | 155 | ||||
-rw-r--r-- | files/fa/web/html/applying_color/index.html (renamed from files/fa/web/html/افزودن_رنگ/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/html/attributes/index.html | 607 | ||||
-rw-r--r-- | files/fa/web/html/tips_for_authoring_fast-loading_html_pages/index.html | 127 | ||||
-rw-r--r-- | files/fa/web/javascript/guide/control_flow_and_error_handling/index.html (renamed from files/fa/web/javascript/راهنما/control_flow_and_error_handling/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/javascript/guide/details_of_the_object_model/index.html (renamed from files/fa/web/javascript/راهنما/details_of_the_object_model/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/javascript/guide/functions/index.html (renamed from files/fa/web/javascript/راهنما/functions/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/javascript/guide/grammar_and_types/index.html (renamed from files/fa/web/javascript/راهنما/grammar_and_types/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/javascript/guide/index.html (renamed from files/fa/web/javascript/راهنما/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/javascript/guide/introduction/index.html (renamed from files/fa/web/javascript/راهنما/مقدمه/index.html) | 0 | ||||
-rw-r--r-- | files/fa/web/جاوااسکریپت/index.html | 129 |
18 files changed, 1041 insertions, 256 deletions
diff --git a/files/fa/web/api/canvas_api/tutorial/index.html b/files/fa/web/api/canvas_api/tutorial/index.html new file mode 100644 index 0000000000..2e74741940 --- /dev/null +++ b/files/fa/web/api/canvas_api/tutorial/index.html @@ -0,0 +1,180 @@ +--- +title: رسم گرافیک با Canvas +slug: HTML/Canvas/Drawing_Graphics_with_Canvas +translation_of: Web/API/Canvas_API/Tutorial +translation_of_original: Web/API/Canvas_API/Drawing_graphics_with_canvas +--- +<div class="note"> + <p dir="rtl">بخش عمدهای از این مطلب (به جز مستندات drawWindow) به صفحهی اصلی <a href="/en/Canvas_tutorial" title="/en/Canvas_tutorial">آموزش Canvas</a> منتقل شده است، بنابراین این صفحه نیز به احتمال زیاد به آن قسمت منتقل میشود تا از ایجاد محتوای تکراری جلوگیری شود.</p> +</div> +<h3 dir="rtl" id="Introduction" name="Introduction">مقدمه</h3> +<p dir="rtl">با انتشار <a href="/en/Firefox_1.5_for_developers" title="/en/Firefox_1.5_for_developers">فایرفاکس ۱.۵</a>، عنصر جدیدی از HTML برای برنامهنویسی حالت گرافیکی در فایرفاکس به وجود آمد. <code><canvas></code> بر اساس <a href="http://www.whatwg.org/specs/web-apps/current-work/#the-canvas" title="http://www.whatwg.org/specs/web-apps/current-work/#the-canvas">مستندات WHATWG برای Canvas</a> پیادهسازی شده است که خود این مستندات نیز بر پایهی عنصر <code><canvas></code> در مرورگر سافاری از اپل ایجاد شده است. از آن میتوان برای ترسیم نمودار، عنصرهای واسط کاربری و سایر عنصرهای گرافیکی در مرورگر استفاده کرد.</p> +<p dir="rtl"><code><canvas></code> با ایجاد یک سطح ترسیمی با اندازهی ثابت سبب میشود که یک یا چند <em>فضای گرافیکی</em> به وجود بیایند. در این مقاله ما بر روی فضای گرافیکی ۲ بعدی تمرکز میکنیم. برای گرافیک ۳ بعدی، شما باید از <a href="/en/WebGL" title="/en/WebGL">فضای گرافیکی WebGL</a> استفاده کنید.</p> +<h3 dir="rtl" id="The_2D_Rendering_Context" name="The_2D_Rendering_Context">فضای گرافیکی ۲ بعدی</h3> +<h4 dir="rtl" id="یک_نمونهی_ساده">یک نمونهی ساده</h4> +<p dir="rtl">برای شروع، با نمونهای ساده که دو مستطیل با فضای مشترک شفاف مشخص شدهاند، آغاز میکنیم:</p> +<p><img align="right" alt="Example 1." class="internal" src="/@api/deki/files/602/=Canvas_ex1.png"></p> +<pre class="brush: js"><html> + <head> + <script type="application/javascript"> +function draw() { + var canvas = document.getElementById("canvas"); + var ctx = canvas.getContext("2d"); + + ctx.fillStyle = "rgb(200,0,0)"; + ctx.fillRect (10, 10, 55, 50); + + ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; + ctx.fillRect (30, 30, 55, 50); +} + </script> + </head> + <body onload="draw()"> + <canvas id="canvas" width="300" height="300"></canvas> + </body> +</html> +</pre> +<p dir="rtl">تابع <code>draw</code> با دریافت عنصر <code>canvas</code> فضای ۲ بعدی آن را مشخص میکند. شی <code>ctx</code> میتواند برای رسم گرافیک روی بوم استفاده شود. در این کد، دو مستطیل با تنظیمات <code>fillStyle</code> و <code>fiilRect</code> با فضای مشترک شفاف رسم میشوند. <code>fillStyle</code> دوم از <code>rgba</code> برای مشخص کردن شفافیت با رنگ مورد نظر، استفاده میکند.</p> +<p dir="rtl"><code>fillRect</code> برای رسم مستطیل، <code>strokeRect</code> برای رسم حاشیههای مستطیل و <code>clearRect</code> برای پاککردن مستطیل استفاده میشوند. برای ایجاد شکلهای پیچیدهتر، از مسیرها استفاده میشود.</p> +<h4 dir="rtl" id="Using_Paths" name="Using_Paths">استفاده از مسیرها</h4> +<p dir="rtl">تابع <code>beginPath</code> یک مسیر جدید را آغاز میکند و متدهای <code>moveTo</code>, <code>lineTo</code>, <code>arcTo</code>, <code>arc</code> و از این قبیل، بخشهای مختلفی را به مسیر تعریفشده اضافه میکنند. مسیر ایجاد شده توسط تابع <code>closePath</code> بسته میشود. زمانی که یک مسیر ایجاد شود، شما میتوانید با <code>fill</code> یا <code>stroke</code> فضای داخل یا حاشیهی مسیر را روی بوم رسم کنید.</p> +<p><img align="right" alt="Example 2." class="internal" src="/@api/deki/files/603/=Canvas_ex2.png"></p> +<pre class="brush: js"><html> + <head> + <script type="application/javascript"> +function draw() { + var canvas = document.getElementById("canvas"); + var ctx = canvas.getContext("2d"); + + ctx.fillStyle = "red"; + + ctx.beginPath(); + ctx.moveTo(30, 30); + ctx.lineTo(150, 150); + // was: ctx.quadraticCurveTo(60, 70, 70, 150); which is wrong. + ctx.bezierCurveTo(60, 70, 60, 70, 70, 150); // <- this is right formula for the image on the right -> + ctx.lineTo(30, 30); + ctx.fill(); +} + </script> + </head> + <body onload="draw()"> + <canvas id="canvas" width="300" height="300"></canvas> + </body> +</html> +</pre> +<p dir="rtl">فراخوانی هر یک از توابع <code>fill</code> یا <code>stroke</code>، روی مسیر فعلی تاثیر میگذارد. اگر دوباره قصد رنگآمیزی یا ایجاد حاشیه در مسیر را داشته باشیم باید مجدد آن را تعریف کنیم.</p> +<h4 dir="rtl" id="Graphics_State" name="Graphics_State">حالت گرافیکی</h4> +<p dir="rtl">صفتهای یک فضای گرافیکی مانند <code>fillStyle</code>, <code>strokeStyle</code>, <code>lineWidth</code> و <code>lineJoin</code> قسمتی از حالت گرافیکی فعلی هستند. فضای گرافیکی شامل دو متد <code>save</code> و <code>restore</code> است که میتوانند برای انتقال حالت کنونی به مجموعهی حالتها یا از مجموعهی حالتها استفاده شوند.</p> +<h4 dir="rtl" id="A_More_Complicated_Example" name="A_More_Complicated_Example">یک نمونهی پیچیدهتر</h4> +<p dir="rtl">در ادامه به نمونهای پیچیدهتر میپردازیم که شامل مسیرها، حالت، و همچنین ماتریس انتقال است. متدهای این فضا یعنی <code>translate</code>, <code>scale</code> و <code>rotate</code> برای انتقال ماتریس به کار میروند که تمامی نقطههای ایجاد شده ابتدا توسط این ماتریس منتقل میشوند.</p> +<p><img align="right" alt="Example 3." class="internal" src="/@api/deki/files/604/=Canvas_ex3.png"></p> +<pre class="brush: js"> <html> + <head> + <script type="application/javascript"> + function drawBowtie(ctx, fillStyle) { + + ctx.fillStyle = "rgba(200,200,200,0.3)"; + ctx.fillRect(-30, -30, 60, 60); + + ctx.fillStyle = fillStyle; + ctx.globalAlpha = 1.0; + ctx.beginPath(); + ctx.moveTo(25, 25); + ctx.lineTo(-25, -25); + ctx.lineTo(25, -25); + ctx.lineTo(-25, 25); + ctx.closePath(); + ctx.fill(); + } + + function dot(ctx) { + ctx.save(); + ctx.fillStyle = "black"; + ctx.fillRect(-2, -2, 4, 4); + ctx.restore(); + } + + function draw() { + var canvas = document.getElementById("canvas"); + var ctx = canvas.getContext("2d"); + + // note that all other translates are relative to this + // one + ctx.translate(45, 45); + + ctx.save(); + //ctx.translate(0, 0); // unnecessary + drawBowtie(ctx, "red"); + dot(ctx); + ctx.restore(); + + ctx.save(); + ctx.translate(85, 0); + ctx.rotate(45 * Math.PI / 180); + drawBowtie(ctx, "green"); + dot(ctx); + ctx.restore(); + + ctx.save(); + ctx.translate(0, 85); + ctx.rotate(135 * Math.PI / 180); + drawBowtie(ctx, "blue"); + dot(ctx); + ctx.restore(); + + ctx.save(); + ctx.translate(85, 85); + ctx.rotate(90 * Math.PI / 180); + drawBowtie(ctx, "yellow"); + dot(ctx); + ctx.restore(); + } + </script> + </head> + <body onload="draw()"> + <canvas id="canvas" width="300" height="300"></canvas> + </body> + </html> +</pre> +<p dir="rtl">قطعه کد بالا دو متد <code>drawBowtie</code> و <code>dot</code> را که هر کدام ۴ مرتبه فراخوانی شدهاند، دربرمیگیرد. قبل از هر فراخوانی، از متدهای <code>translate</code> و <code>rotate</code> برای ایجاد ماتریس انتقال استفاده میشود که به ترتیب نقطه و پاپیون را مکاندهی میکنند. <code>dot</code> یک مستطیل کوچک به مرکز (0, 0) و <code>drawBowtie</code> یک پاپیون کوچک را با استفاده از مسیرها و رنگ مورد نظر به وجود میآورد.</p> +<p dir="rtl">هر چه عملیات ماتریس انباشتهتر میشوند، متدهای <code>save</code> و <code>restore</code> برای ذخیرهسازی و بازگرداندن حالت گرافیکی استفاده میشوند. چیزی که باید به یاد داشت این است که چرخش همیشه در مسیر فعلی شکل میگیرد یعنی ترتیب<code> translate() rotate() translate()</code> به یک شکل و ترتیب <code>translate() translate() rotate()</code> به شکلی دیگر منجر میشوند.</p> +<h3 dir="rtl" id="Compatibility_With_Apple_.3Ccanvas.3E" name="Compatibility_With_Apple_.3Ccanvas.3E">سازگاری با عنصر <canvas> اپل</h3> +<p dir="rtl">در اکثر موارد، <code><canvas></code> با نمونهی پیادهسازی شدهی اپل سازگاری دارد. اگرچه چند مورد هستند که باید به آنها توجه کرد.</p> +<h4 dir="rtl" id="Required_.3C.2Fcanvas.3E_tag" name="Required_.3C.2Fcanvas.3E_tag">برچسب پایانی مورد نیاز است</h4> +<p dir="rtl">در پیادهسازی سافاری از اپل، <code><canvas></code> عنصری است که مشابه <code><img></code> پیادهسازی شده است، یعنی به برچسب پایانی نیازی ندارد. اگرچه، برای اینکه <code><canvas></code> به صورت گسترده در وب استفاده شود، برخی امکانات برای محتوای بازگشتی بایستی فراهم شوند. از این رو، پیادهسازی موزیلا از این عنصر، نیازمند استفاده از برچسب پایانی است.</p> +<p dir="rtl">اگر به محتوای بازگشتی نیازی نباشد، یک نمونهی ساده مانند <code><canvas id="foo" ...></canvas></code> با هر دو پیادهسازی سافاری و موزیلا سازگاری دارد، با این تفاوت که سافاری برچسب پایانی را در نظر نمیگیرد.</p> +<p dir="rtl">اگر محتوای بازگشتی مورد استفاده قرار گیرد، بایستی از برخی تکنیکهای CSS برای ایجاد آن در سافاری استفاده کرد و همچنین از برخی تکنیکها برای فهماندن این مطلب به IE!</p> +<h3 dir="rtl" id="Additional_Features" name="Additional_Features">ویژگیهای دیگر</h3> +<h4 dir="rtl" id="فراهمکردن_محتوای_وب_در_داخل_Canvas">فراهمکردن محتوای وب در داخل Canvas</h4> +<div class="note" dir="rtl"> + این ویژگی تنها با مجوزهای مرورگر Chrome قابل اعمال است و در صفحههای HTML معمولی استفاده نمیشود. <a href="http://mxr.mozilla.org/mozilla/source/content/canvas/src/nsCanvasRenderingContext2D.cpp#2352" title="http://mxr.mozilla.org/mozilla/source/content/canvas/src/nsCanvasRenderingContext2D.cpp#2352">علت آن را بدانید</a>.</div> +<p dir="rtl">پیادهسازی موزیلا از <code>canvas</code> با استفاده از متد <a href="/en/DOM/CanvasRenderingContext2D#drawWindow()" title="/en/DOM/CanvasRenderingContext2D#drawWindow()"><code>drawWindow</code></a> گسترش یافته است. این متد تصویری از یک <code>صفحهی</code> DOM را در داخل canvas رسم میکند. برای نمونه:</p> +<p>Mozilla's <code>canvas</code> is extended with the <a href="/en/DOM/CanvasRenderingContext2D#drawWindow()" title="en/DOM/CanvasRenderingContext2D#drawWindow()"><code>drawWindow()</code></a> method. This method draws a snapshot of the contents of a DOM <code>window</code> into the canvas. For example,</p> +<pre class="brush: js">ctx.drawWindow(window, 0, 0, 100, 200, "rgb(255,255,255)"); +</pre> +<p dir="rtl">قطعهکد بالا محتوای پنجرهی فعلی را در مستطیلی با ابعاد ذکر شده به پیکسل نسبت به گوشهی بالا و چپ پنچره در یک پیشزمینهی سفید از بوم، رسم میکند. با مشخص کردن "rgba(255,255,255,0)" به عنوان رنگ، محتوا با پیشزمینهی شفاف رسم میشود.</p> +<p dir="rtl">معمولا استفاده از رنگ پیشزمینهای به جز سفید "rgb(255,255,255)" یا شفاف کار درستی نیست چرا که تمامی مرورگرها از این استاندارد برای نمایش صفحات وب استفاده میکنند.</p> +<p dir="rtl">با این روش، ممکن است بتوان یک IFRAME پنهان با محتوای دلخواه (برای نمونه متنی که با CSS سبکدهی شده باشد یا SVG) را در یک بوم رسم کرد، که به این صورت میتوان آن را مقیاسدهی کرد یا چرخاند یا هر عمل دیگری که با انتقالهای فعلی میتوان انجام داد.</p> +<p dir="rtl">Ted Mielczarek با افزونهی <a href="http://ted.mielczarek.org/code/mozilla/tabpreview/" title="http://ted.mielczarek.org/code/mozilla/tabpreview/">tab preview</a> خود در chrome این امکان را فراهم میکند تا بتوان تصویرهای کوچک از وبسایتها را مشاهده کرد، و کد آن نیز در دسترس است.</p> +<div class="note" dir="rtl"> + <strong>یادداشت</strong>: استفاده از <code>canvas.drawWindow()</code> در داخل رخداد <code>onload</code> سند عمل نمیکند. در فایرفاکس ۳.۵ به بعد، میتوان با استفاده از رخداد <a href="/en/Gecko-Specific_DOM_Events#MozAfterPaint" title="/en/Gecko-Specific_DOM_Events#MozAfterPaint">MozAfterPaint</a> این حالت را در زمان بارگذاری صفحه پیادهسازی کرد.</div> +<h3 id="See_also" name="See_also">See also</h3> +<ul> + <li><a href="/en/HTML/Canvas" title="en/HTML/Canvas">Canvas topic page</a></li> + <li><a href="/en/Canvas_tutorial" title="en/Canvas_tutorial">Canvas tutorial</a></li> + <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#the-canvas">WHATWG specification</a></li> + <li><a class="external" href="http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/Canvas.html" title="http://developer.apple.com/documentation/AppleApplications/Conceptual/SafariJSProgTopics/Tasks/Canvas.html">Apple Canvas Documentation</a></li> + <li><a class="external" href="http://weblogs.mozillazine.org/roc/archives/2005/05/rendering_web_p.html">Rendering Web Page Thumbnails</a></li> + <li>Some <a href="/Special:Tags" title="Site Tags">examples</a>: + <ul> + <li><a class="external" href="http://azarask.in/projects/algorithm-ink">Algorithm Ink</a></li> + <li><a class="external" href="http://www.tapper-ware.net/canvas3d/">OBJ format 3D Renderer</a></li> + <li><a href="/en/A_Basic_RayCaster" title="en/A_Basic_RayCaster">A Basic RayCaster</a></li> + <li><a class="external" href="http://awordlike.textdriven.com/">The Lightweight Visual Thesaurus</a></li> + <li><a class="external" href="http://caimansys.com/painter/">Canvas Painter</a></li> + </ul> + </li> + <li><a href="/Special:Tags" title="Site Tags">And more...</a></li> +</ul> +<p>{{ languages( { "fr": "fr/Dessiner_avec_canvas", "ja": "ja/Drawing_Graphics_with_Canvas", "pl": "pl/Rysowanie_grafik_za_pomoc\u0105_Canvas", "ko": "ko/Drawing_Graphics_with_Canvas" } ) }}</p> diff --git a/files/fa/web/api/node/innertext/index.html b/files/fa/web/api/htmlelement/innertext/index.html index 98dd0eed8f..98dd0eed8f 100644 --- a/files/fa/web/api/node/innertext/index.html +++ b/files/fa/web/api/htmlelement/innertext/index.html diff --git a/files/fa/web/api/server-sent_events/index.html b/files/fa/web/api/server-sent_events/index.html new file mode 100644 index 0000000000..9b22801732 --- /dev/null +++ b/files/fa/web/api/server-sent_events/index.html @@ -0,0 +1,99 @@ +--- +title: Server-sent events +slug: Server-sent_events +tags: + - NeedsTranslation + - Server-sent events + - TopicStub +translation_of: Web/API/Server-sent_events +--- +<p>Traditionally, a web page has to send a request to the server to receive new data; that is, the page requests data from the server. With server-sent events, it's possible for a server to send new data to a web page at any time, by pushing messages to the web page. These incoming messages can be treated as <em><a href="/en-US/docs/DOM/event" title="DOM/Event">Events</a> + data</em> inside the web page.</p> +<table class="topicpage-table"> + <tbody> + <tr> + <td> + <h2 class="Documentation" id="Documentation" name="Documentation">Documentation</h2> + <dl> + <dt> + <a href="/en-US/docs/Server-sent_events/Using_server-sent_events" title="Server-sent events/Using server-sent events">Using server-sent events</a></dt> + <dd> + A tutorial guide to writing both server and client side part of a server-sent events app.</dd> + <dt> + <a href="/en-US/docs/Server-sent_events/EventSource" title="Server-sent events/EventSource">EventSource reference</a></dt> + <dd> + A reference to the client-side EventSource API.</dd> + </dl> + <p><span class="alllinks"><a href="/en-US/docs/tag/Server-sent_events" title="tag/Server-sent events">View All...</a></span></p> + </td> + <td> + <h2 class="Tools" id="Tools" name="Tools">Tools</h2> + <ul> + <li>Remy Sharp’s <a class="link-https" href="https://github.com/remy/polyfills/blob/master/EventSource.js">EventSource polyfill</a></li> + <li>Yaffle’s <a class="link-https" href="https://github.com/Yaffle/EventSource" title="https://github.com/Yaffle/EventSource">EventSource polyfill</a></li> + <li>Rick Waldron’s <a class="link-https" href="https://github.com/rwldrn/jquery.eventsource">jquery plugin</a></li> + </ul> + <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">Related Topics</h2> + <ul> + <li><a href="/en-US/docs/AJAX" title="AJAX">AJAX</a>, <a href="/en-US/docs/JavaScript" title="JavaScript">JavaScript</a>, <a href="/en-US/docs/WebSockets" title="WebSockets">WebSockets</a></li> + </ul> + </td> + </tr> + </tbody> +</table> +<h2 id="See_also">See also</h2> +<ul> + <li>A <a href="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/" title="http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/">Twitter like application</a> powered by server-sent events and <a class="link-https" href="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends%20timeline" title="https://github.com/mozilla/webowonder-demos/tree/master/demos/friends timeline">its code on Github</a>.</li> + <li><a href="http://dsheiko.com/weblog/html5-and-server-sent-events" title="http://dsheiko.com/weblog/html5-and-server-sent-events">HTML5 and Server-sent events</a></li> + <li><a href="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html" title="http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html">Server-sent events using Asp.Net</a></li> +</ul> +<h2 id="Specification">Specification</h2> +<ul> + <li><a href="http://dev.w3.org/html5/eventsource/" title="http://dev.w3.org/html5/eventsource/">Server-sent events</a></li> +</ul> +<h2 id="Browser_compatibility">Browser compatibility</h2> +<div> + {{CompatibilityTable}}</div> +<div id="compat-desktop"> + <table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>EventSource support</td> + <td>9</td> + <td>{{CompatGeckoDesktop("6.0")}}</td> + <td>{{CompatUnknown}}</td> + <td>11</td> + <td>5</td> + </tr> + </tbody> + </table> +</div> +<div id="compat-mobile"> + <table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>EventSource support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> + </table> +</div> diff --git a/files/fa/web/css/انتخابگرـویژگی/index.html b/files/fa/web/css/attribute_selectors/index.html index 54cf34cd5d..54cf34cd5d 100644 --- a/files/fa/web/css/انتخابگرـویژگی/index.html +++ b/files/fa/web/css/attribute_selectors/index.html diff --git a/files/fa/web/css/media_queries/ابزار-تست-رسانه-پاسخگو/index.html b/files/fa/web/css/media_queries/using_media_queries/index.html index 286a3e8ba2..286a3e8ba2 100644 --- a/files/fa/web/css/media_queries/ابزار-تست-رسانه-پاسخگو/index.html +++ b/files/fa/web/css/media_queries/using_media_queries/index.html diff --git a/files/fa/web/css/انتخابگرـنوع/index.html b/files/fa/web/css/type_selectors/index.html index 5a4b5e4c89..5a4b5e4c89 100644 --- a/files/fa/web/css/انتخابگرـنوع/index.html +++ b/files/fa/web/css/type_selectors/index.html diff --git a/files/fa/web/css/بزرگنمایی/index.html b/files/fa/web/css/zoom/index.html index e664b6b4cc..e664b6b4cc 100644 --- a/files/fa/web/css/بزرگنمایی/index.html +++ b/files/fa/web/css/zoom/index.html diff --git a/files/fa/web/guide/html/html5/index.html b/files/fa/web/guide/html/html5/index.html new file mode 100644 index 0000000000..f2ae6b581b --- /dev/null +++ b/files/fa/web/guide/html/html5/index.html @@ -0,0 +1,155 @@ +--- +title: HTML5 +slug: HTML/HTML5 +translation_of: Web/Guide/HTML/HTML5 +--- +<p dir="rtl"><span class="seoSummary">HTML5 آخرین نسخه از مجموعه استانداردهای <a href="/fa/docs/HTML" title="/fa/docs/HTML">HTML</a> است</span>، که نشاندهندهی دو مفهوم متفاوت است:</p> + +<ul dir="rtl"> + <li>نسخهای جدید از <em>زبان</em> HTML، با عنصرهای جدید، صفتها و رفتار آنها.</li> + <li>مجموعهای بزرگتر از فناوریها که منجر به تولید وبسایتها و برنامههای قدرتمند و گوناگونی میشوند: که به این مجموعه <em>HTML5 و دوستان</em> یا به اختصار HTML5 گفته میشود.</li> +</ul> + +<p dir="rtl"><span class="seoSummary">این صفحه به منابع متفاوتی از فناوریهای HTML5 پیوند خورده است، دستهبندی شده در گروههای مختلف</span>، که هر گروه دربرگیرندهی فعالیتی متفاوت است: <em>semantics (عنصرهای معناگرا)</em>، که در توضیح هر چه بیشتر و دقیقتر محتوا نقش دارند، <em>connectivity (اتصال)</em>، که روشهای جدیدی برای برقراری ارتباط با سرور معرفی میکند، <em>offline & storage (ذخیرهسازی آفلاین)</em>، که وبسایت را برای ذخیرهی دادههای آفلاین و عملکرد بهتر زمانی که مرورگر کاربر در حالت آفلاین قرار دارد بهینه میکند، <em>multimedia (محتوای چندرسانهای)</em>، که صوت و تصویر را به عنوان شهروند درجه یک وب معرفی میکند، <em>3D، Graphics & Effects (سهبعدی، گرافیک و جلوههای تصویری)</em>، که به ارایهی جلوههای تصویری پیچیدهتر منجر میشود، <em>performance & integration (عملکرد و جامعیت)</em>، که وبسایتی سریعتر و در عین حال منطبقتر با رایانهی کاربر میسازد، <em>device access (دسترسی از طریق سایر دستگاهها)</em>، که اجازهی استفادهی دستگاههای ورودی/خروجی بیشتری را میدهد، و <em>styling (سبکدهی)</em>، که دست توسعهدهندگان در ایجاد قالبهای پیچیدهتر را باز میکند.</p> + +<div class="cleared row topicpage-table"> +<div class="section"> +<h2 dir="rtl" id="Semantics_(عنصرهای_معناگرا)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3827/HTML5_Semantics_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Semantics (عنصرهای معناگرا)</h2> + +<dl> + <dt dir="rtl"><a href="/en-US/docs/Sections_and_Outlines_of_an_HTML5_document" title="/en-US/docs/Sections_and_Outlines_of_an_HTML5_document">بخشهای مختلف صفحه در HTML5</a></dt> + <dd dir="rtl">نگاهی به عنصرهای بخشبندی صفحه در HTML5:</dd> + <dd>{{ HTMLElement("section") }}, {{ HTMLElement("article") }}, {{ HTMLElement("nav") }}, {{ HTMLElement("header") }}, {{ HTMLElement("footer") }}, {{ HTMLElement("aside") }} و {{ HTMLElement("hgroup") }}.</dd> + <dt dir="rtl"><a href="/en-US/docs/Using_HTML5_audio_and_video" title="/en-US/docs/Using_HTML5_audio_and_video">استفاده از audio و vedio در HTML5</a></dt> + <dd dir="rtl">عنصرهای {{ HTMLElement("audio") }} و {{ HTMLElement("video") }} با قرارگرفتن در صفحه، اجازهی تغییراتی جدید در نحوهی اجرای محتوای چندرسانهای را میدهند.</dd> + <dt dir="rtl"><a href="/en-US/docs/HTML/Forms_in_HTML" title="/en-US/docs/HTML/Forms_in_HTML">فرمها در HTML5</a></dt> + <dd dir="rtl">نگاهی به بهبودهای ایجادشده در فرمهای وب، constraint validation API، چند صفت جدید، مقدارهای جدیدی برای {{ HTMLElement("input") }} صفت {{ htmlattrxref("type", "input") }} و عنصر جدید {{ HTMLElement("output") }}.</dd> + <dt dir="rtl">عنصرهای معناگرای جدید</dt> + <dd dir="rtl">علاوه بر عنصرهای بخشبندی، رسانه و فرم، عنصرهای متعددی مانند {{ HTMLElement("mark") }}، {{ HTMLElement("figure") }}، {{ HTMLElement("figcaption") }}، {{ HTMLElement("data") }}، {{ HTMLElement("time") }}، {{ HTMLElement("output") }}، {{ HTMLElement("progress") }}، یا {{ HTMLElement("meter") }} تعداد <a href="/en-US/docs/HTML/HTML5/HTML5_element_list" title="/en-US/docs/HTML/HTML5/HTML5_element_list">عنصرهای مجاز HTML5</a> را افرایش میدهند.</dd> + <dt dir="rtl">بهبودهای ایجادشده در {{HTMLElement("iframe")}}</dt> + <dd dir="rtl">با استفاده از صفتهای{{htmlattrxref("sandbox", "iframe")}}، {{htmlattrxref("seamless", "iframe")}} و {{htmlattrxref("srcdoc", "iframe") }} توسعهدهندگان میتوانند میزان امنیت و کارکرد یک عنصر {{HTMLElement("iframe")}} را به دقت بررسی کنند.</dd> + <dt dir="rtl"><a href="/en-US/docs/MathML" title="/en-US/docs/MathML">MathML</a></dt> + <dd dir="rtl">استفاده از فرمولهای ریاضی را به صورت مستقیم در کد، ممکن میسازد.</dd> + <dt dir="rtl"><a href="/en-US/docs/HTML/HTML5/Introduction_to_HTML5" title="/en-US/docs/HTML/HTML5/Introduction_to_HTML5">مقدمهای بر HTML5</a></dt> + <dd dir="rtl">این مقاله به معرفی مشکلات موجود HTML5 که در طراحی وب یا برنامهی وب ممکن است وجود داشته باشند، میپردازد.</dd> + <dt dir="rtl"><a href="/en-US/docs/HTML/HTML5/HTML5_Parser" title="/en-US/docs/HTML/HTML5/HTML5_Parser">مفسر منطبق بر HTML5</a></dt> + <dd dir="rtl">مفسر، که بایت به بایت از یک سند HTML را به درخت DOM تبدیل میکند، گسترش یافتهاست و به دقت رفتاری که در تمامی حالتها پیش میآید بررسی کرده، حتی کد نامعتبر HTML را، که منجر به بهینهتر شدن و قابلپیشبینیتر شدن مرورگرهای منطبق با HTML5 میشود.</dd> +</dl> + +<h2 dir="rtl" id="Connectivity_(اتصال)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3839/HTML5_Connectivity_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Connectivity (اتصال)</h2> + +<dl> + <dt dir="rtl"><a href="/en-US/docs/WebSockets" title="WebSockets">Web Sockets</a></dt> + <dd dir="rtl">اجازهی برقراری یک ارتباط پایدار بین صفحه و سرور را میدهد که از طریق آن میتوان به مبادلهی دادههایی غیر از سند HTML پرداخت.</dd> + <dt dir="rtl"><a href="/en-US/docs/Server-sent_events/Using_server-sent_events" title="/en-US/docs/Server-sent_events/Using_server-sent_events">رخدادهای سمت سرور</a></dt> + <dd dir="rtl">سابق بر این سرور تنها با دریافت درخواست از مرورگر (کاربر) میتوانست به آن پاسخ دهد اما الان میتواند این کار را بدون درخواست مرورگر نیز انجام دهد.</dd> + <dt dir="rtl"><a href="/en-US/docs/WebRTC" title="/en-US/WebRTC">WebRTC</a></dt> + <dd dir="rtl">این فناوری، که مخفف Real-Time Communication یا ارتباط بلادرنگ است، اجازهی برقراری ارتباط با سایر افراد و کنترل ویدیوکنفرانس به طور مستقیم از مرورگر را میهد بدون آنکه به افزونهای خاص یا برنامهای خارجی نیاز باشد.</dd> +</dl> + +<h2 dir="rtl" id="Offline_storage_(ذخیرهسازی_آفلاین)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3833/HTML5_Offline_Storage_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Offline & storage (ذخیرهسازی آفلاین)</h2> + +<dl> + <dt dir="rtl"><a href="/en-US/docs/HTML/Using_the_application_cache" title="/en-US/docs/HTML/Using_the_application_cache">منابع آفلاین: حافظهی نهان برنامه</a></dt> + <dd dir="rtl">Firefox به طور کامل منابع آفلاین در HTML5 را پشتیبانی میکند. سایر مرورگرها نیز این ویژگی را کمابیش پشتیبانی میکنند.</dd> + <dt dir="rtl"><a href="/en-US/docs/Online_and_offline_events" title="/en-US/docs/Online_and_offline_events">رخدادهای آنلاین و آفلاین</a></dt> + <dd dir="rtl">Firefox 3 مستندات WHATWG دربارهی رخدادهای آنلاین و آفلاین را پشتیبانی میکند، که به برنامهها اجازه میدهد تشخیص بدهند آیا یک اتصال اینترنت فعال موجود است یا خیر، یا اینکه آیا یک اتصال قطع و وصل میشود یا خیر.</dd> + <dt dir="rtl"><a href="/en-US/docs/DOM/Storage" title="/en-US/docs/DOM/Storage">نشست سمت-مرورگر WHATWG و ذخیرهسازی پایدار (در برابر ذخیرهسازی DOM)</a></dt> + <dd dir="rtl">نشست سمت-مرورگر و ذخیرهسازی پایدار به برنامههای وب اجازه میدهند که ساختاردادههای مورد نیاز خود را در مرورگر کاربر ذخیرهسازی کنند.</dd> + <dt dir="rtl"><a href="/en-US/docs/IndexedDB" title="/en-US/docs/IndexedDB">IndexedDB</a></dt> + <dd dir="rtl">یک استاندارد وب است که برای ذخیرهسازی دادهها با حجم بالا در مرورگر کاربر به کار میرود و برای جستجوهای با سرعت بالا بر این دادهها با استفاده از اندیسها، صورت میپذیرد.</dd> + <dt dir="rtl"><a href="/en-US/docs/Using_files_from_web_applications" title="/en-US/docs/Using_files_from_web_applications">استفاده از فایلها توسط برنامههای وب</a></dt> + <dd dir="rtl">پشتیبانی از API جدید فایل در HTML5 به Gecko اضافهشده است تا برنامههای وب بتوانند به فایلهایی که کاربر انتخاب میکنند دسترسی داشته باشند، که این امر شامل پشتیبانی از فایلهای چندگانه با استفاده از عنصر <span style="font-family: monospace;">{{ HTMLElement("input") }}</span> که از <a href="/en-US/docs/HTML/Element/Input#attr-type" title="/en-US/docs/HTML/Element/Input#attr-type">نوع</a> فایل میباشد، میشود یا صفت جدید <a href="/en-US/docs/HTML/Element/Input#attr-multiple" title="HTML/Element/input#attr-multiple"><strong>multiple</strong></a>. همچنین <a href="/en-US/docs/DOM/FileReader" title="DOM/FileReader"><code>FileReader</code></a> نیز وجود دارد.</dd> +</dl> + +<h2 dir="rtl" id="Multimedia_(چندرسانهای)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3835/HTML5_Multimedia_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Multimedia (چندرسانهای)</h2> + +<dl> + <dt dir="rtl"><a href="/en-US/docs/Using_HTML5_audio_and_video" title="/en-US/docs/Using_HTML5_audio_and_video">استفاده از audio و vedio در HTML5</a></dt> + <dd dir="rtl">عنصرهای {{ HTMLElement("audio") }} و {{ HTMLElement("video") }} با قرارگرفتن در صفحه، اجازهی تغییراتی جدید در نحوهی اجرای محتوای چندرسانهای را میدهند.</dd> + <dt dir="rtl"><a href="/en-US/docs/WebRTC" title="/en-US/WebRTC">WebRTC</a></dt> + <dd dir="rtl">این فناوری، که مخفف Real-Time Communication یا ارتباط بلادرنگ است، اجازهی برقراری ارتباط با سایر افراد و کنترل ویدیوکنفرانس به طور مستقیم از مرورگر را میهد بدون آنکه به افزونهای خاص یا برنامهای خارجی نیاز باشد.</dd> + <dt dir="rtl"><a href="/en-US/docs/DOM/Using_the_Camera_API" title="/en-US/docs/DOM/Using_the_Camera_API">استفاده از API دوربین</a></dt> + <dd dir="rtl">اجازهی استفاده، تغییر و ذخیرهسازی یک تصویر (عکس) را از دوربین رایانهی کاربر میدهد.</dd> +</dl> + +<h2 dir="rtl" id="3D_graphics_effects_(سهبعدی،_گرافیک_و_جلوههای_تصویری)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3841/HTML5_3D_Effects_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">3D, graphics & effects (سهبعدی، گرافیک و جلوههای تصویری)</h2> + +<dl> + <dt dir="rtl"><a href="/en-US/docs/Canvas_tutorial" title="/en-US/docs/Canvas_tutorial">خودآموز Canvas</a></dt> + <dd dir="rtl">دربارهی عنصر جدید <code>{{ HTMLElement("canvas") }}</code> و چگونگی رسم نمودارها و سایر اشیا در Firefox بیاموزید.</dd> + <dt dir="rtl">API متن HTML5 برای عنصرهای <a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas"><code><canvas></code></a><a href="/en-US/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas"> </a></dt> + <dd dir="rtl">API متن در HTML5 توسط عنصرهای {{ HTMLElement("canvas") }} پشتیبانی میشوند.</dd> + <dt dir="rtl"><a href="/en-US/docs/WebGL" title="WebGL">WebGL</a></dt> + <dd dir="rtl">WebGL گرافیک سهبعدی را با معرفی APIای که بسیار نزدیک به OpenGL ES 2.0 عمل میکند، به صفحات وب میآورد که میتواند در عنصرهای {{ HTMLElement("canvas") }} در HTML5 به کار رود.</dd> + <dt dir="rtl"><a href="/en-US/docs/SVG" title="/en-US/docs/SVG">SVG</a></dt> + <dd dir="rtl">فرمتی مبتنی بر XML از تصاویر برداری که به صورت مستقیم میتواند در سند HTML به کار رود.</dd> +</dl> + +<dl> +</dl> +</div> + +<div class="section"> +<h2 dir="rtl" id="Performance_integration_(عملکرد_و_جامعیت)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3831/HTML5_Performance_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Performance & integration (عملکرد و جامعیت)</h2> + +<dl> + <dt dir="rtl"><a href="/en-US/docs/DOM/Using_web_workers" title="Using web workers">Web Workers</a></dt> + <dd dir="rtl">به فایلهای JavaScript اجازه میدهد که در پسزمینه و بدون اینکه رخدادهای فعال را درگیر خود سازند، اجرا شوند.</dd> + <dt dir="rtl"><code><a href="/en-US/docs/DOM/XMLHttpRequest" title="XMLHttpRequest">XMLHttpRequest</a></code> سطح ۲</dt> + <dd dir="rtl">اجازهی برقراری ارتباط بخشی از صفحه با سرور را میدهد، تا محتوای پویا را بر اساس فعالیت کاربران یا زمان تغییر دهد. این فناوری پایه و اساس <a href="/en-US/docs/AJAX" title="/en-US/docs/AJAX">Ajax</a> است.</dd> + <dt dir="rtl">JIT - کامپایلکردن موتورهای JavaScript</dt> + <dd dir="rtl">نسل جدید موتورهای JavaScript بسیار قدرتمندتر از نسل قبلی هستند که در اجرا و عملکرد برنامههای JavaScript بسیار تاثیرگذار هستند.</dd> + <dt dir="rtl"><a href="https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history" title="https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history">History API</a></dt> + <dd dir="rtl">اجازهی دستکاری تاریخچه (history) مرورگر را میدهد که این کار برای صفحاتی که شامل اطلاعات جدید هستند، مفید میباشد.</dd> + <dt dir="rtl"><a href="/en-US/docs/HTML/Content_Editable" title="/en-US/docs/HTML/Content_Editable">صفت contentEditable: وبسایت خود را به یک wiki تبدیل کنید!</a></dt> + <dd dir="rtl">HTML5 صفت contentEditable را استاندارد کرده است. دربارهی این ویژگی بیشتر بدانید.</dd> + <dt dir="rtl"><a href="/en-US/docs/DragDrop/Drag_and_Drop" title="/en-US/docs/DragDrop/Drag_and_Drop">کشیدن و رهاکردن</a></dt> + <dd dir="rtl">API کشیدن و رهاکردن در HTML5 پشتیبانی از این عملیات را در وبسایتها و بین وبسایتها میسر میکند. همچنین یک API سادهتر را جهت استفاده در extensionها و برنامههای مبتنی بر Mozilla شامل میشود.</dd> + <dt dir="rtl"><a href="/en-US/docs/Focus_management_in_HTML" title="/en-US/docs/Focus_management_in_HTML">مدیریت Focus در HTML</a></dt> + <dd dir="rtl">صفتهای جدید <code>activeElement</code> و <code>hasFocus</code> در HTML5 پشتیبانی میشوند.</dd> + <dt dir="rtl"><a href="/en-US/docs/Web-based_protocol_handlers" title="/en-US/docs/Web-based_protocol_handlers">protocol handlerهای مبتنی بر وب</a></dt> + <dd dir="rtl">شما اکنون میتوانید برنامههای وب را با استفاده از متد <code>navigator.registerProtocolHandler()</code> به عنوان protocol handler ثبت کنید.</dd> + <dt dir="rtl"><a href="/en-US/docs/DOM/window.requestAnimationFrame" title="/en-US/docs/DOM/window.requestAnimationFrame"><code>requestAnimationFrame</code></a></dt> + <dd dir="rtl">اجازهی کنترل رندرشدن انیمیشنها را برای دستیابی به عملکردی بهینه، میدهد.</dd> + <dt dir="rtl"><a href="/en-US/docs/DOM/Using_full-screen_mode" title="/en-US/docs/DOM/Using_full-screen_mode">Fullscreen API</a></dt> + <dd dir="rtl">چگونگی استفاده از حالت تمامصفحه را کنترل میکند، بدون اینکه واسط کاربری (پیشفرض) مرورگر نمایش داده شود.</dd> + <dt dir="rtl"><a href="/en-US/docs/API/Pointer_Lock_API" title="/en-US/docs/API/Pointer_Lock_API">Pointer Lock API</a></dt> + <dd dir="rtl">اجازهی قفل شدن اشارهگر (ماوس) روی محتوا را میدهد، تا بازیها و برنامههای مشابه دیگر مشکل از دسترفتن focus را نداشته باشند.</dd> + <dt dir="rtl"><a href="/en-US/docs/Online_and_offline_events" title="/en-US/docs/Online_and_offline_events">رخدادهای آنلاین و آفلاین</a></dt> + <dd dir="rtl">برای ایجاد یک برنامهی وب با قابلیت اجرای آفلاین، شما باید بدانید چه زمانی برنامهی شما واقعا در حالت آفلاین قرار میگیرد. همینطور باید بدانید چه زمانی برنامهی شما در حالت آفلاین باز میگردد.</dd> +</dl> + +<h2 dir="rtl" id="Device_access_(دسترسی_از_طریق_سایر_دستگاهها)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3837/HTML5_Device_Access_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Device access (دسترسی از طریق سایر دستگاهها)</h2> + +<dl> + <dt dir="rtl"><a href="/en-US/docs/DOM/Using_the_Camera_API" title="/en-US/docs/DOM/Using_the_Camera_API">استفاده از API دوربین</a></dt> + <dd dir="rtl">اجازهی استفاده، تغییر و ذخیرهسازی یک تصویر (عکس) را از دوربین رایانهی کاربر میدهد.</dd> + <dt dir="rtl"><a href="/en-US/docs/DOM/Touch_events" title="/en-US/docs/DOM/Touch_events">رخدادهای Touch</a></dt> + <dd dir="rtl">handlerهایی که به رخدادهای ایجادشده توسط کاربری که با صفحهی لمسی کار میکند، پاسخ میدهد.</dd> + <dt dir="rtl"><a href="/en-US/docs/Using_geolocation" title="/en-US/docs/Using_geolocation">استفاده از geolocation</a></dt> + <dd dir="rtl">این اجاره را به مرورگر میدهد تا موقعیت جغرافیایی کاربر را شناسایی کند.</dd> + <dt dir="rtl"><a href="/en-US/docs/Detecting_device_orientation" title="/en-US/docs/Detecting_device_orientation">شناسایی جهت دستگاه</a></dt> + <dd dir="rtl">این اجازه را به مرورگر میدهد تا هرگاه جهت دستگاهی که مرورگر روی آن کار میکند تغییر یافت، اطلاعات آن را دریافت کند. از این ویژگی میتوان به عنوان یک دستگاه ورودی استفاده کرد برای نمونه (ساخت بازیهایی که به تغییر جهت دستگاه واکنش نشان میدهند یا منطبق ساختن ظاهر یک صفحه با جهت نمایش دستگاه - افقی یا عمودی).</dd> + <dt dir="rtl"><a href="/en-US/docs/API/Pointer_Lock_API" title="/en-US/docs/API/Pointer_Lock_API">Pointer Lock API</a></dt> + <dd dir="rtl">اجازهی قفل شدن اشارهگر (ماوس) روی محتوا را میدهد، تا بازیها و برنامههای مشابه دیگر مشکل از دسترفتن focus را نداشته باشند.</dd> +</dl> + +<h2 dir="rtl" id="Styling_(سبکدهی)" style="margin: 0px 0px 0.25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: medium none;"><img alt="" src="/files/3829/HTML5_Styling_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">Styling (سبکدهی)</h2> + +<p dir="rtl"><a href="/en-US/docs/CSS" title="/en-US/docs/CSS">CSS</a> گسترش یافته است تا سبکدهی به عنصرها را به حالتی پیشرفتهتر منتقل کند. از این ویژگیها اغلب به عنوان <a href="/en-US/docs/CSS/CSS3" title="/en-US/docs/CSS/CSS3">CSS3</a> یاد میشود، از این رو CSS دیگر یک استاندارد یکپارچه نیست و ماژولهای مختلف آن در سطح ۳ نیستند، بعضی در سطح ۱ و بعضی در سطح ۴، با تمام سطحهای میانی که وجود دارند.</p> + +<dl> + <dt dir="rtl">ویژگیهای جدید در سبکدهی تصویر پسزمینه</dt> + <dd dir="rtl">اکنون ایجاد سایه در یک عنصر (جعبه) با استفاده از {{ cssxref("box-shadow") }} میسر است و <a href="/en-US/docs/CSS/Multiple_backgrounds" title="/en-US/docs/CSS/Multiple_backgrounds">تصویرهای پسزمینهی چندگانه</a> قابل استفاده هستند.</dd> + <dt dir="rtl">حاشیههایی جذابتر</dt> + <dd dir="rtl">اکنون نه تنها میتوان با استفاده از تصویرها و به کارگیری {{ cssxref("border-image") }} ،حاشیهی عنصرها را ایجاد کرد بلکه کنارههای گرد (rounded-borders) نیز با استفاده از ویژگی {{ cssxref("border-radius") }} قابل پیادهسازی هستند.</dd> + <dt dir="rtl">پویانمایی</dt> + <dd dir="rtl">با استفاده از <a href="/en-US/docs/CSS/Using_CSS_transitions" title="/en-US/docs/CSS/Using_CSS_transitions">تبدیلات در CSS</a> برای پویانمایی بین حالتهای مختلف یا از <a href="/en-US/docs/CSS/Using_CSS_animations" title="/en-US/docs/CSS/Using_CSS_animations">پویانمایی در CSS</a> جهت پویانمایی بخشی از صفحه بدون نیاز به رخدادهای جاوااسکریپت، شما میتوانید عنصرهای متحرک در صفحهی خود را کنترل کنید.</dd> + <dt dir="rtl">بهبودهای ایجاد شده در Typography</dt> + <dd dir="rtl">توسعهدهندگان برای دسترسی به Typography بهتر اکنون کنترل بیشتری دارند. آنها میتوانند {{ cssxref("text-overflow") }} و <a href="/en-US/docs/CSS/hyphens" title="/en-US/docs/CSS/hyphens">فاصلهگذاری</a> را کنترل کنند، همچنین <a href="/en-US/docs/CSS/text-shadow" title="/en-US/docs/CSS/text-shadow">سایهای</a> که به متن اعمال میشود یا <a href="/en-US/docs/CSS/text-decoration" title="/en-US/docs/CSS/text-decoration">جزییاتمتن</a> را به دقت کنترل کنند. به لطف ویژگی {{ cssxref("@font-face") }} فونتهای مختلفی را میتوان به صفحهی خود پیوست کرد.</dd> + <dt dir="rtl">لایههای نمایشی جدید</dt> + <dd dir="rtl">در راستای ارتقای انعطافپذیری در طراحی، دو لایهی جدید افزوده شدهاند: <a href="/en-US/docs/CSS/Using_CSS_multi-column_layouts" title="/en-US/docs/CSS/Using_CSS_multi-column_layouts">CSS multi-column layout</a> و <a href="/en-US/docs/CSS/Flexbox" title="/en-US/docs/CSS/Flexbox">CSS flexible box layout</a>.</dd> +</dl> +</div> +</div> diff --git a/files/fa/web/html/افزودن_رنگ/index.html b/files/fa/web/html/applying_color/index.html index 99f2d980cf..99f2d980cf 100644 --- a/files/fa/web/html/افزودن_رنگ/index.html +++ b/files/fa/web/html/applying_color/index.html diff --git a/files/fa/web/html/attributes/index.html b/files/fa/web/html/attributes/index.html new file mode 100644 index 0000000000..70c73bc06b --- /dev/null +++ b/files/fa/web/html/attributes/index.html @@ -0,0 +1,607 @@ +--- +title: مرجع صفتهای HTML +slug: HTML/Attributes +translation_of: Web/HTML/Attributes +--- +<p dir="rtl">عنصرها در HTM <strong>صفتها</strong>یی دارند؛ اینها مقادیر اضافهای هستند که عنصرها را پیکربندی میکنند یا رفتار آنها را در راههای گستردهای بهصورت مناسب با شرایطی که کاربران میخواهند تطبیق میدهند.</p> +<table class="standard-table" dir="rtl"> + <thead> + <tr> + <th style="text-align: center;">نام صفت</th> + <th style="text-align: center;">عنصرها</th> + <th style="text-align: center;">توضیح</th> + </tr> + </thead> + <tbody> + <tr> + <td style="text-align: center;">accept</td> + <td style="text-align: center;">{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td> + <td style="text-align: right;">فهرست انواعی که سرور قبول میکند، معمولا از نوع فایل.</td> + </tr> + <tr> + <td style="text-align: center;">accept-charset</td> + <td style="text-align: center;">{{ HTMLElement("form") }}</td> + <td style="text-align: right;">فهرستی از مجموعه کاراکترهای پشتیبانی شده.</td> + </tr> + <tr> + <td style="text-align: center;">accesskey</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">تعیین کلید میانبری از صفحهکلید جهت فعالسازی یا افزودن focus به عنصر مورد نظر.</td> + </tr> + <tr> + <td style="text-align: center;">action</td> + <td style="text-align: center;">{{ HTMLElement("form") }}</td> + <td style="text-align: right;">نشانی فایلی که قرار است اطلاعات ارسالی از فرم را پردازش کند.</td> + </tr> + <tr> + <td style="text-align: center;">align</td> + <td style="text-align: center;">{{ HTMLElement("applet") }}, {{ HTMLElement("caption") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}, {{ HTMLElement("hr") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }}, {{ HTMLElement("td") }}, {{ HTMLElement("tfoot") }} , {{ HTMLElement("th") }}, {{ HTMLElement("thead") }}, {{ HTMLElement("tr") }}</td> + <td style="text-align: right;">تنظیمات مربوط به چینش عنصر را تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">alt</td> + <td> + <p style="text-align: center;">{{ HTMLElement("applet") }}, {{ HTMLElement("area") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}</p> + </td> + <td style="text-align: right;">متن جایگزین تصویر، زمانی که تصویر قابل نمایش نباشد.</td> + </tr> + <tr> + <td style="text-align: center;">async</td> + <td style="text-align: center;">{{ HTMLElement("script") }}</td> + <td style="text-align: right;">نشاندهندهی این است که اسکریپت باید به صورت نامتقارن اجرا شود.</td> + </tr> + <tr> + <td style="text-align: center;">autocomplete</td> + <td style="text-align: center;">{{ HTMLElement("form") }}, {{ HTMLElement("input") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا کنترلهای موجود در این فرم قابلیت اختیار مقادیر پیشفرض مرورگر را دارند یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">autofocus</td> + <td style="text-align: center;">{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">بعد از بارگذاری صفحه، عنصر مورد نظر focus را به خود میگیرد.</td> + </tr> + <tr> + <td style="text-align: center;">autoplay</td> + <td style="text-align: center;">{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td style="text-align: right;">پخش صوت یا تصویر به محض آماده شدن.</td> + </tr> + <tr> + <td style="text-align: center;">bgcolor</td> + <td style="text-align: center;">{{ HTMLElement("body") }}, {{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("table") }}, {{ HTMLElement("tbody") }}, {{ HTMLElement("tfoot") }}, {{ HTMLElement("td") }}, {{ HTMLElement("th") }}, {{ HTMLElement("tr") }}</td> + <td style="text-align: right;"> + <p>رنگ پیشزمینهی عنصر.</p> + <p>یادداشت: این یک صفت قدیمی است که باید از ویژگی {{ Cssxref("background-color") }} در CSS به جای آن استفاده کرد.</p> + </td> + </tr> + </tbody> + <tbody> + <tr> + <td style="text-align: center;">border</td> + <td style="text-align: center;">{{ HTMLElement("img") }}, {{ HTMLElement("object") }}, {{ HTMLElement("table") }}</td> + <td> + <p style="text-align: right;">نشاندهندهی حاشیهی عنصر مورد نظر.</p> + <p style="text-align: right;">یادداشت: این یک صفت قدیمی است که باید از ویژگی {{ Cssxref("border") }} در CSS به جای آن استفاده کرد.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">buffered</td> + <td style="text-align: center;">{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td style="text-align: right;">شامل بازهی زمانی است که محتوای مورد نظر در آن بازه بافر شده است.</td> + </tr> + <tr> + <td style="text-align: center;">challenge</td> + <td style="text-align: center;">{{ HTMLElement("keygen") }}</td> + <td style="text-align: right;">رشتهای از حروف که به همراه کلید عمومی ارسال میشود.</td> + </tr> + <tr> + <td style="text-align: center;">charset</td> + <td style="text-align: center;">{{ HTMLElement("meta") }}, {{ HTMLElement("script") }}</td> + <td style="text-align: right;">نوع کدگذاری کاراکترهای موجود در صفحه یا اسکریپت را تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">checked</td> + <td style="text-align: center;">{{ HTMLElement("command") }}, {{ HTMLElement("input") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا عنصر مورد نظر در زمان بارگذاری صفحه باید انتخاب شود یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">cite</td> + <td style="text-align: center;">{{ HTMLElement("blockquote") }}, {{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("q") }}</td> + <td style="text-align: right;">به نشانی منبع نقل قول اشاره میکند.</td> + </tr> + <tr> + <td style="text-align: center;">class</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">اغلب به همراه CSS به کار میرود تا عنصرهایی با ویژگیهای مشترک را سبکدهی کند.</td> + </tr> + <tr> + <td style="text-align: center;">code</td> + <td style="text-align: center;">{{ HTMLElement("applet") }}</td> + <td style="text-align: right;">نشانی فایل با پیشوند class که اپلت برای بارگذاری و اجراشدن به آن نیاز دارد را، شامل میشود.</td> + </tr> + <tr> + <td style="text-align: center;">codebase</td> + <td style="text-align: center;">{{ HTMLElement("applet") }}</td> + <td style="text-align: right;">این صفت نشانی مطلق یا نسبی دایرکتوری که فایلهای با پیشوند class مورد نیاز اپلت هستند، را شامل میشود.</td> + </tr> + <tr> + <td style="text-align: center;">color</td> + <td style="text-align: center;">{{ HTMLElement("basefont") }}, {{ HTMLElement("font") }}, {{ HTMLElement("hr") }}</td> + <td> + <p style="text-align: right;">این صفت رنگ متن را با توجه به دو الگوی "نام رنگ" یا "مقدار هگزادسیمال رنگ" مشخص میکند.</p> + <p style="text-align: right;">یادداشت: این یک صفت قدیمی است که باید از ویژگی {{ Cssxref("color") }} در CSS به جای آن استفاده کرد.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">cols</td> + <td style="text-align: center;">{{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">تعداد ستونهای ناحیهی متنی را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">colspan</td> + <td style="text-align: center;">{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td> + <td style="text-align: right;">تعداد ستونهای یک سلول (خانه) از جدول را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">content</td> + <td style="text-align: center;">{{ HTMLElement("meta") }}</td> + <td style="text-align: right;">مقداری که منطبق با <code>http-equiv</code> یا <code>name</code> است.</td> + </tr> + <tr> + <td style="text-align: center;">contenteditable</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">نشاندهندهی این است که آیا محتوای عنصر قابل ویرایش هستنند یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">contextmenu</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">ID یک {{ HTMLElement("menu") }} را به عنوان منو تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">controls</td> + <td style="text-align: center;">{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا مرورگر دکمههای کنترل فایل صوتی یا تصویری را باید نشان بدهد یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">coords</td> + <td style="text-align: center;">{{ HTMLElement("area") }}</td> + <td style="text-align: right;">مجموعهای از مقادیر که نشاندهندهی مختصات ناحیهی مورد نظر هستند.</td> + </tr> + <tr> + <td style="text-align: center;">data</td> + <td style="text-align: center;">{{ HTMLElement("object") }}</td> + <td style="text-align: right;">نشانی منبع مورد نیاز را تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">datetime</td> + <td style="text-align: center;">{{ HTMLElement("del") }}, {{ HTMLElement("ins") }}, {{ HTMLElement("time") }}</td> + <td style="text-align: right;">نشاندهندهی تاریخ و زمان به کار رفته در عنصر مورد نظر است.</td> + </tr> + <tr> + <td style="text-align: center;">default</td> + <td style="text-align: center;">{{ HTMLElement("track") }}</td> + <td style="text-align: right;">نشاندهندهی این است که track قبل از اینکه تنظیمات کاربر تغییر کند، باید فعال شود.</td> + </tr> + <tr> + <td style="text-align: center;">defer</td> + <td style="text-align: center;">{{ HTMLElement("script") }}</td> + <td style="text-align: right;">نشاندهندهی این است که اسکریپت بلافاصله بعد از بارگذاری و تفسیر صفحه باید اجرا شود.</td> + </tr> + <tr> + <td style="text-align: center;">dir</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">جهت نوشتهشدن متن را مشخص میکند. مقادیر قابل قبول عبارتند از ltr (چپ به راست)و rtl (راست به چپ)</td> + </tr> + <tr> + <td style="text-align: center;">dirname</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">disabled</td> + <td style="text-align: center;">{{ HTMLElement("button") }}, {{ HTMLElement("command") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("optgroup") }}, {{ HTMLElement("option") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا کاربر امکان تعامل با عنصر مورد نظر را دارد یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">draggable</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">قابلیت کشیدهشدن عنصر (کلیک بر روی آن و حرکت دادنش) را تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">dropzone</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">ناحیهای که عنصر کشیدهشده را میتوان در آن رها (drop) کرد.</td> + </tr> + <tr> + <td style="text-align: center;">enctype</td> + <td style="text-align: center;">{{ HTMLElement("form") }}</td> + <td style="text-align: right;">وقتی از <code>method</code> ای مانند POST برای ارسال مقادیر فرم استفاده میشود، این صفت نوع محتوای دادهای را در فرم تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">for</td> + <td style="text-align: center;">{{ HTMLElement("label") }}, {{ HTMLElement("output") }}</td> + <td style="text-align: right;">تعیین عنصرهایی که به عنصر مورد نظر تعلق دارند.</td> + </tr> + <tr> + <td style="text-align: center;">form</td> + <td style="text-align: center;">{{ HTMLElement("button") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("label") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">نشاندهندهی فرمی است که مالک (پدر) عنصر مورد نظر است.</td> + </tr> + <tr> + <td style="text-align: center;">headers</td> + <td style="text-align: center;">{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td> + <td style="text-align: right;">IDهای عنصر(های) <th> که به این عنصر مربوط میشوند.</td> + </tr> + <tr> + <td style="text-align: center;">height</td> + <td style="text-align: center;">{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: left;">در برخی کاربردها مانند {{ HTMLElement("div") }}، این یک صفت قدیمی است که باید از ویژگی {{ Cssxref("height") }} در CSS به جای آن استفاده کرد. در سایر موارد مانند {{ HTMLElement("canvas") }} استفاده از این صفت ضروری است.</p> + </td> + </tr> + </tbody> + <tbody> + <tr> + <td style="text-align: center;">hidden</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">ارتباط یک عنصر را نشان میدهد.</td> + </tr> + <tr> + <td style="text-align: center;">high</td> + <td style="text-align: center;">{{ HTMLElement("meter") }}</td> + <td style="text-align: right;">پایینترین مرز از بالاترین محدوده را نشان میدهد.</td> + </tr> + <tr> + <td style="text-align: center;">href</td> + <td style="text-align: center;">{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("link") }}</td> + <td style="text-align: right;">نشانی منبعی که پیوند (لینک) به آن اشاره دارد.</td> + </tr> + <tr> + <td style="text-align: center;">hreflang</td> + <td style="text-align: center;">{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td> + <td style="text-align: right;">زبان منبعی که پیوند (لینک) به آن اشاره دارد.</td> + </tr> + <tr> + <td style="text-align: center;">http-equiv</td> + <td style="text-align: center;">{{ HTMLElement("meta") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">icon</td> + <td style="text-align: center;">{{ HTMLElement("command") }}</td> + <td style="text-align: right;">تصویری که نشاندهندهی command باشد را تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">id</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">اغلب با CSS به کار میرود تا عنصر مورد نظر را سبک دهی کند. مقدار این صفت باید منحصر به فرد (یکتا) باشد.</td> + </tr> + <tr> + <td style="text-align: center;">ismap</td> + <td style="text-align: center;">{{ HTMLElement("img") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا تصویر بخشی از یک image map سمت سرور میباشد یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">itemprop</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">keytype</td> + <td style="text-align: center;">{{ HTMLElement("keygen") }}</td> + <td style="text-align: right;">نوع کلید تولید شده را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">kind</td> + <td style="text-align: center;">{{ HTMLElement("track") }}</td> + <td style="text-align: right;">گونهی متنی track را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">label</td> + <td style="text-align: center;">{{ HTMLElement("track") }}</td> + <td style="text-align: right;">متنی خوانا برای track مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">lang</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">زبانی که در عنصر مورد نظر به کار رفته است را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">language</td> + <td style="text-align: center;">{{ HTMLElement("script") }}</td> + <td style="text-align: right;">زبان اسکریپت را در عنصر مورد نظر تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">list</td> + <td style="text-align: center;">{{ HTMLElement("input") }}</td> + <td style="text-align: right;">فهرستی از گزینههای از پیش تعریف شده را برای کاربر مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">loop</td> + <td style="text-align: center;">{{ HTMLElement("audio") }}, {{ HTMLElement("bgsound") }}, {{ HTMLElement("marquee") }}, {{ HTMLElement("video") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا محتوای مورد نظر (متن، صوت یا تصویر) پس از تمام شدن، دوباره باید اجرا شود یا به نمایش دربیاید یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">low</td> + <td style="text-align: center;">{{ HTMLElement("meter") }}</td> + <td style="text-align: right;">بالاترین مرز از پایینترین محدوده را نشان میدهد.</td> + </tr> + <tr> + <td style="text-align: center;">manifest</td> + <td style="text-align: center;">{{ HTMLElement("html") }}</td> + <td style="text-align: right;">نشانی فایل cache manifest (جهت مرور آفلاین صفحات) را در سند مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">max</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}</td> + <td style="text-align: right;">نشاندهندهی بیشترین مقدار مجاز است.</td> + </tr> + <tr> + <td style="text-align: center;">maxlength</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">بیشترین تعداد کاراکترها را در عنصر مورد نظر تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">media</td> + <td style="text-align: center;">{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}</td> + <td style="text-align: right;">بخش کوچکی از رسانه که منبع پیوند داده شده برای آن طراحی شده است، را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">method</td> + <td style="text-align: center;">{{ HTMLElement("form") }}</td> + <td style="text-align: right;">مشخص میکند که از کدام متد HTTP برای ارسال دادههای فرم استفاده شود، که میتواند GET (پیشفرض) یا POST باشد.</td> + </tr> + <tr> + <td style="text-align: center;">min</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("meter") }}</td> + <td style="text-align: right;">نشاندهندهی کمترین مقدار مجاز است.</td> + </tr> + <tr> + <td style="text-align: center;">multiple</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td> + <td style="text-align: right;"> + <p>نشاندهندهی این است که آیا مقدارهای چندتایی میتوانند در ورودیهای <code>email</code> یا <code>file</code> وارد شوند یا خیر.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">name</td> + <td style="text-align: center;">{{ HTMLElement("button") }}, {{ HTMLElement("form") }}, {{ HTMLElement("fieldset") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("input") }}, {{ HTMLElement("keygen") }}, {{ HTMLElement("object") }}, {{ HTMLElement("output") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}, {{ HTMLElement("map") }}, {{ HTMLElement("meta") }}, {{ HTMLElement("param") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: right;">نام عنصر. برای نمونه از این صفت برای شناسایی فیلدهای مورد نظر که به سمت سرور ارسال شدهاند استفاده میشود.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">novalidate</td> + <td style="text-align: center;">{{ HTMLElement("form") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: right;">این صفت نشاندهندهی این است که هنگام ارسال فرم، دادههای آن نباید مورد سنجش و ارزیابی قرار بگیرند.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">open</td> + <td style="text-align: center;">{{ HTMLElement("details") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: right;">نشاندهندهی این است که آیا جزییات زمان بارگذاری صفحه نمایش داده میشوند یا خیر.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">optimum</td> + <td style="text-align: center;">{{ HTMLElement("meter") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: right;">نشاندهندهی مقدار عددی بهینه است.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">pattern</td> + <td style="text-align: center;">{{ HTMLElement("input") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: right;">عبارتی منظم را تعریف میکند که مقدار عنصر مورد نظر برابر آن مورد سنجش و ارزیابی قرار میگیرد.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">ping</td> + <td style="text-align: center;">{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">placeholder</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: right;">با نمایش کادری کوچک به کاربر اطلاع میدهد که چه چیزی در فیلد قابل نوشتن است.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">poster</td> + <td style="text-align: center;">{{ HTMLElement("video") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: right;">نشانی که به یک فریم از فیلم اشاره دارد تا زمانی که کاربر هنوز اقدام به پخش فیلم نکرده است به وی نمایش داده شود.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">preload</td> + <td style="text-align: center;">{{ HTMLElement("audio") }}, {{ HTMLElement("video") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا تمام منبع، بخشی از آن یا هیچ چیز باید از قبل از اقدام کاربر برای پخش محتوا، بارگذاری شود.</td> + </tr> + <tr> + <td style="text-align: center;">pubdate</td> + <td style="text-align: center;">{{ HTMLElement("time") }}</td> + <td dir="ltr" style="text-align: center;"> + <p dir="rtl" style="text-align: right;">نشاندهندهی این است که آیا این تاریخ و زمان مطابق با تاریخ نزدیکترین عنصر {{ HTMLElement("article") }} والد خود است یا خیر.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">radiogroup</td> + <td style="text-align: center;">{{ HTMLElement("command") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">readonly</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("textarea") }}</td> + <td dir="ltr" style="text-align: center;"> + <p dir="rtl" style="text-align: right;">نشاندهندهی این است که آیا این عنصر قابل ویرایش است یا خیر.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">rel</td> + <td style="text-align: center;">{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("link") }}</td> + <td style="text-align: right;">ارتباط بین شی هدف و شی پینوندی را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">required</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("select") }}, {{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا این عنصر (از فرم) نیاز به تکمیل شدن از طرف کاربر دارد یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">reversed</td> + <td style="text-align: center;">{{ HTMLElement("ol") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا فهرست باید به ترتیب نزولی نمایش داده شود، بر خلاف ترتیب صعودی.</td> + </tr> + <tr> + <td style="text-align: center;">rows</td> + <td style="text-align: center;">{{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">تعداد سطرهای ناحیهی متنی را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">rowspan</td> + <td style="text-align: center;">{{ HTMLElement("td") }}, {{ HTMLElement("th") }}</td> + <td style="text-align: right;">تعداد سطرهایی که سلول (خانه) جدول باید بر اساس آن ایجاد شود را مشخص میکند.</td> + </tr> + <tr> + <td style="text-align: center;">sandbox</td> + <td style="text-align: center;">{{ HTMLElement("iframe") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">spellcheck</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">نشاندهندهی این است که آیا عملیات بررسی واژهها برای این عنصر مجاز است یا خیر.</td> + </tr> + <tr> + <td style="text-align: center;">scope</td> + <td style="text-align: center;">{{ HTMLElement("th") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">scoped</td> + <td style="text-align: center;">{{ HTMLElement("style") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">seamless</td> + <td style="text-align: center;">{{ HTMLElement("iframe") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">selected</td> + <td style="text-align: center;">{{ HTMLElement("option") }}</td> + <td style="text-align: right;">مقداری را تعیین میکند که در زمان بارگذاری صفحه، در فهرست انتخاب شده است.</td> + </tr> + <tr> + <td style="text-align: center;">shape</td> + <td style="text-align: center;">{{ HTMLElement("a") }}, {{ HTMLElement("area") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">size</td> + <td style="text-align: center;">{{ HTMLElement("input") }}, {{ HTMLElement("select") }}</td> + <td style="text-align: right;">عرض عنصر را (بر اساس پیکسل) تعیین میکند. اگر عنصر مورد نظر از نوع <code>text</code> یا <code>password</code> باشد این صفت تعداد کاراکترهای عنصر را تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">sizes</td> + <td style="text-align: center;">{{ HTMLElement("link") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">span</td> + <td style="text-align: center;">{{ HTMLElement("col") }}, {{ HTMLElement("colgroup") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">src</td> + <td style="text-align: center;">{{ HTMLElement("audio") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("track") }}, {{ HTMLElement("video") }}</td> + <td style="text-align: right;">نشانی فایلی که عنصر مورد نظر از آن به عنوان منبع استفاده میکند.</td> + </tr> + <tr> + <td style="text-align: center;">srcdoc</td> + <td style="text-align: center;">{{ HTMLElement("iframe") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">srclang</td> + <td style="text-align: center;">{{ HTMLElement("track") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">start</td> + <td style="text-align: center;">{{ HTMLElement("ol") }}</td> + <td style="text-align: right;">اولین عدد در فهرست را تعیین میکند، اگر غیر از ۱ باشد.</td> + </tr> + <tr> + <td style="text-align: center;">step</td> + <td style="text-align: center;">{{ HTMLElement("input") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">style</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">سبکهای CSS را تعریف میکند که در صورت وجود فایلهای قدیمی بر روی آنها نوشته میشوند.</td> + </tr> + <tr> + <td style="text-align: center;">summary</td> + <td style="text-align: center;">{{ HTMLElement("table") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">tabindex</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">با ویرایش این صفت، ترتیب انتخاب شدن عنصرهای صفحه در مرورگر به حالتی که برایش تعیین شود تغییر مییابد.</td> + </tr> + <tr> + <td style="text-align: center;">target</td> + <td style="text-align: center;">{{ HTMLElement("a") }}, {{ HTMLElement("area") }}, {{ HTMLElement("base") }}, {{ HTMLElement("form") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">title</td> + <td style="text-align: center;"><a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">Global attribute</a></td> + <td style="text-align: right;">متنی که در یک کادر کوچک با قرار دادن mouse روی عنصر مورد نظر نمایش مییابد.</td> + </tr> + <tr> + <td style="text-align: center;">type</td> + <td style="text-align: center;">{{ HTMLElement("button") }}, {{ HTMLElement("input") }}, {{ HTMLElement("command") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("object") }}, {{ HTMLElement("script") }}, {{ HTMLElement("source") }}, {{ HTMLElement("style") }}, {{ HTMLElement("menu") }}</td> + <td style="text-align: right;">نوع عنصر را تعریف میکند.</td> + </tr> + <tr> + <td style="text-align: center;">usemap</td> + <td style="text-align: center;">{{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}</td> + <td style="text-align: center;"> </td> + </tr> + <tr> + <td style="text-align: center;">value</td> + <td style="text-align: center;">{{ HTMLElement("button") }}, {{ HTMLElement("option") }}, {{ HTMLElement("input") }}, {{ HTMLElement("li") }}, {{ HTMLElement("meter") }}, {{ HTMLElement("progress") }}, {{ HTMLElement("param") }}</td> + <td style="text-align: right;">مقدار پیشفرضی که در زمان بارگذاری صفحه برای عنصر انتخاب میشود را تعیین میکند.</td> + </tr> + <tr> + <td style="text-align: center;">width</td> + <td style="text-align: center;">{{ HTMLElement("canvas") }}, {{ HTMLElement("embed") }}, {{ HTMLElement("iframe") }}, {{ HTMLElement("img") }}, {{ HTMLElement("input") }}, {{ HTMLElement("object") }}, {{ HTMLElement("video") }}</td> + <td dir="ltr" style="text-align: center;"> + <p style="text-align: left;">در برخی موارد مانند {{ HTMLElement("div") }} این یک صفت قدیمی به حساب میآید که باید از ویژگی {{ Cssxref("width") }} در CSS به جای آن استفاده کرد. در سایر موارد مانند {{ HTMLElement("canvas") }} این یک صفت ضروری است که باید ذکر شود.</p> + </td> + </tr> + <tr> + <td style="text-align: center;">wrap</td> + <td style="text-align: center;">{{ HTMLElement("textarea") }}</td> + <td style="text-align: right;">نشاندهندهی این است که آیا متن باید کوتاه شود یا خیر.</td> + </tr> + </tbody> +</table> +<h2 dir="ltr" id="Content_versus_IDL_attributes" style="margin-bottom: 20px; font-size: 28px; line-height: 28px; color: rgb(77, 78, 83); text-align: left;">Content versus IDL attributes</h2> +<p dir="ltr" style="line-height: 1.5em; color: rgb(77, 78, 83);">In HTML, most attributes have two faces: the <strong>content attribute</strong> and the <strong>IDL attribute</strong>.</p> +<p dir="ltr" style="line-height: 1.5em; color: rgb(77, 78, 83);">The content attribute is the attribute as you set it from the content (the HTML code) and you can set it or get it via {{domxref("element.setAttribute()")}} or {{domxref("element.getAttribute()")}}. The content attribute is always a string even when the expected value should be an integer. For example, to set an {{HTMLElement("input")}} element's <code style="font-size: 14px;">maxlength</code> to 42 using the content attribute, you have to call<code style="font-size: 14px;">setAttribute("maxlength", "42")</code> on that element.</p> +<p dir="ltr" style="line-height: 1.5em; color: rgb(77, 78, 83);">The IDL attribute is also known as a JavaScript property. These are the attributes you can read or set using JavaScript properties like <code class="moz-txt-verticalline" style="font-size: 14px;">element.foo</code>. The IDL attribute is always going to use (but might transform) the underlying content attribute to return a value when you get it and is going to save something in the content attribute when you set it. In other words, the IDL attributes, in essence, reflect the content attributes.</p> +<p dir="rtl" style="line-height: 1.5em; color: rgb(77, 78, 83);">Most of the time, IDL attributes will return their valules as they are really used. For example, the default <code style="font-size: 14px;">type</code> for {{HTMLElement("input")}} elements is "text", so if you set<code style="font-size: 14px;">input.type="foobar"</code>, the <code style="font-size: 14px;"><input></code> element will be of type text (in the appearance and the behavior) but the "type" content attribute's value will be "foobar". However, the<code style="font-size: 14px;">type</code> IDL attribute will return the string "text".</p> +<p dir="ltr" style="line-height: 1.5em; color: rgb(77, 78, 83);">IDL attributes are not always strings; for example, <code style="font-size: 14px;">input.maxlength</code> is a number (a signed long). When using IDL attributes, you read or set values of the desired type, so<code style="font-size: 14px;">input.maxlength</code> is always going to return a number and when you set<code style="font-size: 14px;">input.maxlength</code> ,it wants a number. If you pass another type, it is automatically converted to a number as specified by the standard JavaScript rules for type conversion.</p> +<p dir="ltr" style="line-height: 1.5em; color: rgb(77, 78, 83);">IDL attributes can <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">reflect other types</a> such as unsigned long, URLs, booleans, etc. Unfortunately, there are no clear rules and the way IDL attributes behave in conjunction with their corresponding content attributes depends on the attribute. Most of the time, it will follow <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes">the rules laid out in the specification</a>, but sometimes it doesn't. HTML specifications try to make this as developer-friendly as possible, but for various reasons (mostly historical), some attributes behave oddly (<code style="font-size: 14px;">select.size</code>, for example) and you should read the specifications to understand how exactly they behave.</p> +<h2 dir="ltr" id="See_also" style="margin-bottom: 20px; font-size: 28px; line-height: 28px; color: rgb(77, 78, 83);">See also</h2> +<ul dir="ltr" style="margin-bottom: 1.286em; padding-left: 0px; list-style-type: none; color: rgb(77, 78, 83);"> + <li style="padding-bottom: 0px;"><a href="https://developer.mozilla.org/en-US/docs/HTML/Element" title="/en-US/docs/HTML/Element">HTML elements</a></li> +</ul> diff --git a/files/fa/web/html/tips_for_authoring_fast-loading_html_pages/index.html b/files/fa/web/html/tips_for_authoring_fast-loading_html_pages/index.html deleted file mode 100644 index 94048c4ba7..0000000000 --- a/files/fa/web/html/tips_for_authoring_fast-loading_html_pages/index.html +++ /dev/null @@ -1,127 +0,0 @@ ---- -title: نکاتی دربارهی ایجاد صفحات HTML سریع -slug: Web/HTML/Tips_for_authoring_fast-loading_HTML_pages -translation_of: Learn/HTML/Howto/Author_fast-loading_HTML_pages ---- -<p dir="rtl">نکات زیر بر اساس دانش و تجربه به دست آمدهاند.</p> -<p dir="rtl">یک صفحهی وب بهینه نه تنها برای مخاطبهای شما تعاملیتر است، بلکه روی وبسرور و اتصال اینترنت شما نیز تاثیرگذار است. این امر میتواند برای سایتهایی که ترافیک بالایی دارند مانند سایتهای خبری، مسالهای اساسی باشد.</p> -<p dir="rtl">بهینهسازی عملکرد یک صفحه فقط برای کاربران با اینترنت کم سرعت مطرح نیست. بلکه برای آن دسته از کاربران با اینترنت پرسرعت نیز تاثیر به سزایی دارد.</p> -<h2 dir="rtl" id="Tips" name="Tips">نکتهها</h2> -<h3 dir="rtl" id="Reduce_page_weight" name="Reduce_page_weight">کاهش دادن وزن صفحه</h3> -<p dir="rtl">وزن صفحه، یکی از مهمترین فاکتورهای بارگیری یک صفحه است.</p> -<p dir="rtl">کاهش وزن صفحه به این معنا است که با حذف کردن جاهای خالی و خطوط کمکی (comment) و با انتقال اسکریپتها و برگههای سبک سلسلهمراتبی به فایلهای خارجی، سرعت بارگیری صفحه را تا حد امکان افزایش دهیم.</p> -<p dir="rtl">ابزاری مانند <a href="http://tidy.sourceforge.net/" title="http://tidy.sourceforge.net/">HTML Tidy</a> میتوانند به صورت خودکار جاهای خالی اضافی را از یک سند HTML حذف کنند. ابزار دیگری نیز وجود دارند که فایلهای جاوااسکریپت را با تکنیکهای فشردهسازی، فشرده کرده و با کاهش حجم آنها باعث افزایش سرعت بارگیری صفحه میشوند.</p> -<h3 dir="rtl" id="Minimize_the_number_of_files" name="Minimize_the_number_of_files">کاهش تعداد فایلها</h3> -<p dir="rtl">با کاهش یافتن تعداد فایلهای مورد نیاز یک صفحه، تعداد درخواستهای <a href="/en-US/docs/HTTP" title="/en-US/docs/HTTP">HTTP</a> جهت بارگیری صفحه نیز کاهش مییابد.</p> -<p dir="rtl">بسته به تنظیمات حافظهی نهان مرورگر، ممکن است درخواست <code>If-Modified-Since</code> به وبسرور برای هر فایل CSS، جاوااسکریپت یا تصویر فرستاده شود که در آن مشخص میشود آیا فایل نسبت به آخرین باری که دانلود شده، تغییر کرده است یا خیر.</p> -<p dir="rtl">با کاهش تعداد فایلهایی که در یک صفحه به آنها ارجاع داده میشود، تعداد درخواستها به سرور و پاسخهایی که از سرور ارسال میشود نیز کاهش مییابد.</p> -<p dir="rtl">اگر از تصاویر پسزمینه در فایل CSS خود به نسبت زیادی استفاده میکنید میتوانید با استفاده از تکینیکی به نام image sprite این تصاویر را با هم ترکیب کنید تا تعداد درخواستهای ارسالی به سرور کاهش یابد. تنها کافی است با تغییر موقعیت تصویر در صفحه نحوهی نمایش آن را در حالتهای مختلف تنظیم کنید. این تکنیک برای عنصرهایی که ابعاد محدودی در صفحه دارند به خوبی کار میکند. اگرچه تعداد درخواستهای http کمتر و cache کردن هر تصویر نیز میتواند به عنوان راه حل جایگزین مطرح باشد.</p> -<p dir="rtl">زمان زیادی که صرف میشود تا آخرین تاریخ تغییر یک فایل مشخص شود، میتواند منجر به تاخیر در نمایش اولیه از یک صفحه شود، چرا که مرورگر قبل از اینکه صفحه را پردازش کند باید زمان تغییر یا modification هر فایل CSS یا جاوااسکریپت را بررسی کند.</p> -<h3 dir="rtl" id="Reduce_domain_lookups" name="Reduce_domain_lookups">کاهش تعداد ارجاعها به دامنههای مختلف</h3> -<p dir="rtl">از آنجایی که هر دامنهی منحصر به فرد در فرآیند DNS Lookup هزینهی زمانی دارد، زمان بارگذاری صفحه با توجه به تعداد دامنههای مختلف در فایلهای CSS ،جاوااسکریپت و تصویرها افزایش مییابد.</p> -<p dir="rtl">با این حال همیشه به یاد داشته باشید تا آنجا که ممکن است از حداقل تعداد دامنههای مختلف در صفحات سایت استفاده کنید.</p> -<h3 dir="rtl" id="Cache_reused_content" name="Cache_reused_content">محتوای کاربردی را Cache کنید</h3> -<p dir="rtl">اطمینان یابید هر محتوایی که قابل cache شدن است، این اتفاق برایش افتاده باشد و زمان پایانی cache نیز دارا باشد.</p> -<p dir="rtl">در حقیقت باید به فایل سرآیند (header) با نام <code>Last-Modified</code> توجه خاصی داشت. کار این فایل ذخیرهسازی آخرین زمانی است که به صفحات ثابت (<code>html و css و ...</code>) از طریق user agent یا همان مرورگر بر اساس زمان موجود در وب سرور، ارجاع شده است. البته این موضوع در رابطه با صفحات پویا (php و aspx و ...) اتفاق نمیافتد، یعنی این فایل سرآیند ارسال نمیشود.</p> -<p dir="rtl">دربارهی صفحاتی که به صورت پویا ایجاد میشوند، اندکی تحقیق در این باره میتواند بسیار مفید باشد. با استفاده از پیوندهای زیر اطلاعات بیشتری دربارهی cache کردن صفحات پویا کسب کنید:</p> -<ol dir="rtl"> - <li><a class="external" href="http://fishbowl.pastiche.org/2002/10/21/http_conditional_get_for_rss_hackers">HTTP Conditional Get for RSS Hackers</a></li> - <li><a class="external" href="http://annevankesteren.nl/archives/2005/05/http-304">HTTP 304: Not Modified</a></li> - <li><a class="external" href="http://www.cmlenz.net/blog/2005/05/on_http_lastmod.html">On HTTP Last-Modified and ETag</a></li> -</ol> -<h3 dir="rtl" id="Optimally_order_the_components_of_the_page" name="Optimally_order_the_components_of_the_page">ترتیب بهینهی اجزای تشکیل دهندهی صفحه</h3> -<p dir="rtl">ابتدا محتوای صفحه بارگذاری شود، همراه با هرفایل CSS یا JavaScript که در نمایش اولیهی آن تاثیر دارد، تا کاربر بتواند در کوتاهترین زمان ممکن به محتوای صفحه دسترسی داشته باشد. این محتوا معمولا از متن تشکیل میشود که در زمان کوتاهی میتواند در اختیار کاربر قرار گیرد.</p> -<p dir="rtl">هرگونه ویژگی پویا که پس از بارگذاری کامل صفحه مورد نیاز هستند، در مرحلهی اول باید غیرفعال گردد و تنها زمانی فعال شود که تمام محتوای صفحه بارگذاری شده باشد. از جملهی این ویژگیها میتوان به فایلهای JavaScript اشاره کرد که در انتهای سند قرار میگیرند که این امر موجب بارگذاری سریع صفحات میشود.</p> -<h3 dir="rtl" id="Reduce_the_number_of_inline_scripts" name="Reduce_the_number_of_inline_scripts">کاهش تعداد اسکریپتهای برخط (inline)</h3> -<p dir="rtl">این نوع اسکریپتها میتوانند زمان زیادی را به خود اختصاص دهند، چرا که parser باید در نظر بگیرد که یک اسکریپت برخط میتواند ساختار صفحه را هنگامی که خود صفحه در حال parse شدن است، تغییر دهد. کاهش تعداد این اسکریپتها به صورت عمومی، و کاهش استفاده از <code>document.write</code> به صورت اختصاصی، میتواند منجر به افزایش سرعت در بارگذاری صفحات شود. همچنین استفاده از روشهای پیشرفته در <a href="/en-US/docs/AJAX" title="/en-US/docs/AJAX">AJAX</a> جهت تغییر در محتوای صفحه به جای استفاده از <code>document.write</code> توصیه میشود.</p> -<h3 dir="rtl" id="Use_modern_CSS_and_valid_markup" name="Use_modern_CSS_and_valid_markup">استفاده از CSS پیشرفته و عنصرهای معتبر</h3> -<p dir="rtl">استفاده از CSS به صورت صحیح میتواند تعداد عنصرهای مورد نیاز در صفحه را به شکل قابل ملاحظهای کاهش دهد. از جمله این تکنیکها میتوان به جایگزین کردن برخی تصاویر (که به spacer معروف هستند) با معادل CSS آنها جهت قالببندی صفحه اشاره کرد.</p> -<p dir="rtl">استفاده از عنصرهای معتبر نیز مزایای خود را دارد. اول از همه، مرورگرها دیگر نیازی ندارند تا فرآیند بررسی خطا در کد HTML را انجام دهند. ((البته این موضوع با بحث فلسفی آن که ابتدا کاربر محتوای خود را وارد میکند سپس به صورت منطقی فرآیند بررسی آن محتوا آغار میشود، متفاوت است)).</p> -<p dir="rtl">به علاوه، استفاده از عنصرهای معتبر این امکان را در اختیار سایر ابزار میگذارد تا صفحات سایت شما را بررسی (<em>pre-process</em>) کنند. برای نمونه، <a href="http://tidy.sourceforge.net/" title="http://tidy.sourceforge.net/">HTML Tidy</a> میتواند فضای خالی در صفحات و تگهای پایانی اختیاری را حذف کند; اگرچه این ابزار در صفحاتی که دارای خطاهای بسیار در عنصرها باشند، اجرا نمیشود.</p> -<h3 dir="rtl" id="Chunk_your_content" name="Chunk_your_content">محتوا را طبقهبندی کنید</h3> -<p dir="rtl">استفاده از جدولها در قالببندی صفحات یک روش منسوخ است که دیگر نباید استفاده شود. در عوض از عنصر {{ HTMLElement("div") }} و در آیندهی نزدیک از <a href="/en-US/docs/CSS/Using_CSS_multi-column_layouts" title="/en-US/docs/CSS/Using_CSS_multi-column_layouts">ساختار چند ستونی CSS3</a> یا <a href="/en-US/docs/Using_flexbox" title="/en-US/docs/Using_flexbox">ساختار منعطف جعبهای CSS3</a> باید استفاده شود.</p> -<p dir="rtl">جدولها هنوز هم به عنوان عنصرهای معتبر در صفحه شناخته میشوند اما تنها باید برای نمایش دادههای جدولی استفاده گردند. برای این که مرورگرها صفحهی شما را سریعتر پردازش کنند باید از جدولهای تودرتو خودداری کنید.</p> -<p dir="rtl">به جای اینکه از ساختاری مانند این استفاده کنید:</p> -<pre><TABLE> - <TABLE> - <TABLE> - ... - </TABLE> - </TABLE> -</TABLE></pre> -<p dir="rtl">در عوض از جدولهایی که جداگانه هستند یا divها استفاده کنید.</p> -<pre><TABLE>...</TABLE> -<TABLE>...</TABLE> -<TABLE>...</TABLE> -</pre> -<p dir="rtl">همچنین میتوانید مستندات <a href="http://www.w3.org/TR/css3-multicol/" title="http://www.w3.org/TR/css3-multicol/">CSS3 Multi-column Layout</a> یا <a href="http://www.w3.org/TR/css3-flexbox/" title="http://www.w3.org/TR/css3-flexbox/">CSS3 Flexible Box Layout</a> را مشاهده کنید.</p> -<h3 dir="rtl" id="Specify_sizes_for_images_and_tables" name="Specify_sizes_for_images_and_tables">مشخص کردن اندازهی تصویرها و جدولها</h3> -<p dir="rtl">اگر مرورگر به محض دریافت تصویر یا جدول بتواند اندازهی آن را تشخیص دهد، این امر موجب نمایش هر چه بهتر محتوای صفحه در زمان بارگذاری خواهد شد. به همین منظور استفاده از <code>height</code> و <code>width</code> برای تصویرها در هر جایی که ممکن است باید استفاده گردند.</p> -<p dir="rtl">برای جدولها نیز میتوان از قطعه کد CSS زیر استفاده کرد:</p> -<pre> table-layout: fixed; -</pre> -<p dir="rtl">همچنین باید از تگهای <code>COL</code> و <code>COLGROUP</code> برای مشخص کردن عرض جدولهای استفاده کرد.</p> -<h3 dir="rtl" id="Choose_your_user-agent_requirements_wisely" name="Choose_your_user-agent_requirements_wisely">حداقل محدودیتهای مرورگر را در نظر بگیرید</h3> -<p dir="rtl">برای اینکه صفحهی شما در مرورگرهای مختلف با کمترین اختلاف ممکن نمایش داده شود، اطمینان یابید که حداقل استانداردهای مورد نیاز مرورگرها در پروژههایتان رعایت شده باشند. این بدان معنا نیست که محتوای شما باید در تمامی مرورگرها دقیقا به یک شکل نمایش یابد، به خصوص مرورگرهای قدیمی.</p> -<p dir="rtl">در حقیقت، حداقل پیشنیازهای شما باید منطبق با مرورگرهای پیشرفتهای باشند که استانداردهای وب را رعایت میکنند که این مرورگرها شامل Firefox 3.6 به بالا برای تمامی پلتفرمها، Internet Explorer 8 به بالا در ویندوز، Opera 10 به بالا در ویندوز و Safari 4 به بالا در Mac OS X هستند.</p> -<p dir="rtl">اگرچه، بسیاری از نکاتی که در این مقاله فهرست شدهاند، تکنیکهای عمومی هستند که میتوان برای هر مرورگری و برای هر صفحهی وب به کار برد، جدا از پشتیبانی مرورگرها.</p> -<h2 dir="rtl" id="Example_page_structure" name="Example_page_structure">ساختار صفحهی مورد نظر ما</h2> -<p>· <code>HTML</code></p> -<dl> - <dd> - · <code>HEAD</code></dd> -</dl> -<dl> - <dd> - <dl> - <dd> - · <code>LINK </code>...</dd> - <dd dir="rtl"> - فایلهای CSS که جهت نمایش صفحه مورد نیاز هستند. تعداد این فایلها را پایین نگه دارید تا عملکرد صفحه افزایش یابد. همچنین میتوان سایر فایلهای CSS نامربتط با این صفحه را در فایلهای دیگر قرار داد.</dd> - </dl> - </dd> -</dl> -<dl> - <dd> - <dl> - <dd> - · <code>SCRIPT </code>...</dd> - <dd dir="rtl"> - فایلهای JavaScript که <strong>موردنیاز</strong> توابعی هستند که در زمان بارگذاری صفحه فراخوانی میشوند. تعداد این فایلها را جهت عملکرد بهتر صفحه، پایین نگه دارید.</dd> - </dl> - </dd> -</dl> -<dl> - <dd> - · <code>BODY</code></dd> - <dd dir="rtl"> - محتوای مورد نظر صفحه که در قالب جدولها یا divها گردآوری شدهاند. این محتوا میتواند جدا از سایر اجزای صفحه نمایش یابد.</dd> -</dl> -<dl> - <dd> - <dl> - <dd> - · <code>SCRIPT </code>...</dd> - <dd dir="rtl"> - هر اسکریپتی که در ساختار صفحه (DHTML) تغییر ایجاد میکند. این اسکریپتها میتوانند پس از بارگذاری تمام صفحه و نمایش محتوا به کاربر، اجرا شوند. بنابراین دلیلی ندارد که بارگذاری آنها قبل از محتوا صورت گیرد که در این صورت نمایش محتوا به کاربر با تاخیر همراه میشود.</dd> - <dd dir="rtl"> - اگر تصویری جهت حرکتهای rollover در نظر گرفتهاید، باید در این قسمت از صفحه preload یا پیشبارگذاری شوند، جایی که محتوای صفحه قبل از آن نمایش داده شده است.</dd> - </dl> - </dd> -</dl> -<h2 dir="rtl" id="Related_Links" name="Related_Links">پیوندهای مرتبط</h2> -<ul> - <li dir="rtl">کتاب: <a href="http://www.websiteoptimization.com/" title="http://www.websiteoptimization.com/">"Speed Up Your Site" نوشتهی Andy King</a></li> - <li dir="rtl"><a href="http://webmonkey.wired.com/webmonkey/design/site_building/tutorials/tutorial2.html" title="http://webmonkey.wired.com/webmonkey/design/site_building/tutorials/tutorial2.html">آموزش بهینهسازی سایت</a> (WebMonkey)</li> - <li dir="rtl">مقالهی عالی و کامل <a href="http://developer.yahoo.com/performance/rules.html" title="http://developer.yahoo.com/performance/rules.html">Best Practices for Speeding Up Your Web Site</a> از (Yahoo)</li> -</ul> -<div class="originaldocinfo"> - <h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2> - <ul> - <li>Author(s): Bob Clary, Technology Evangelist, Netscape Communications</li> - <li>Last Updated Date: Published 04 Apr 2003</li> - <li>Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.</li> - <li>Note: This reprinted article was originally part of the DevEdge site.</li> - </ul> -</div> -<p> </p> diff --git a/files/fa/web/javascript/راهنما/control_flow_and_error_handling/index.html b/files/fa/web/javascript/guide/control_flow_and_error_handling/index.html index 1b3edc9c8a..1b3edc9c8a 100644 --- a/files/fa/web/javascript/راهنما/control_flow_and_error_handling/index.html +++ b/files/fa/web/javascript/guide/control_flow_and_error_handling/index.html diff --git a/files/fa/web/javascript/راهنما/details_of_the_object_model/index.html b/files/fa/web/javascript/guide/details_of_the_object_model/index.html index 5e523e9124..5e523e9124 100644 --- a/files/fa/web/javascript/راهنما/details_of_the_object_model/index.html +++ b/files/fa/web/javascript/guide/details_of_the_object_model/index.html diff --git a/files/fa/web/javascript/راهنما/functions/index.html b/files/fa/web/javascript/guide/functions/index.html index 626ea544bf..626ea544bf 100644 --- a/files/fa/web/javascript/راهنما/functions/index.html +++ b/files/fa/web/javascript/guide/functions/index.html diff --git a/files/fa/web/javascript/راهنما/grammar_and_types/index.html b/files/fa/web/javascript/guide/grammar_and_types/index.html index 7ccb432c33..7ccb432c33 100644 --- a/files/fa/web/javascript/راهنما/grammar_and_types/index.html +++ b/files/fa/web/javascript/guide/grammar_and_types/index.html diff --git a/files/fa/web/javascript/راهنما/index.html b/files/fa/web/javascript/guide/index.html index 6ebfec2533..6ebfec2533 100644 --- a/files/fa/web/javascript/راهنما/index.html +++ b/files/fa/web/javascript/guide/index.html diff --git a/files/fa/web/javascript/راهنما/مقدمه/index.html b/files/fa/web/javascript/guide/introduction/index.html index 3e8b0f1cff..3e8b0f1cff 100644 --- a/files/fa/web/javascript/راهنما/مقدمه/index.html +++ b/files/fa/web/javascript/guide/introduction/index.html diff --git a/files/fa/web/جاوااسکریپت/index.html b/files/fa/web/جاوااسکریپت/index.html deleted file mode 100644 index 1de3deb24e..0000000000 --- a/files/fa/web/جاوااسکریپت/index.html +++ /dev/null @@ -1,129 +0,0 @@ ---- -title: جاوااسکریپت -slug: Web/جاوااسکریپت -tags: - - JavaScript - - Landing - - NeedsTranslation - - TopicStub ---- -<div class="callout-box"><strong><a href="/fa/docs/Web/JavaScript/A_re-introduction_to_JavaScript">یک معرفی مجدد برای جاوااسکریپت</a></strong><br> -یک بررسی کلی برا آنهایی که <em>فکر میکنند</em> در مورد جاوااسکریپت میدانند</div> - -<p dir="rtl">{{JsSidebar}}</p> - -<p dir="rtl"><strong>JavaScript</strong><sup>®</sup> (اغلب به <strong>JS</strong> مخفف میشود) سبک، مفسر، زبان شیگرا شده با <a href="https://en.wikipedia.org/wiki/First-class_functions" title="https://en.wikipedia.org/wiki/First-class_functions">first-class functions</a>، به عنوان زبان اسکریپت نویسی برای صفحات وب شناخته شده است، اما <a class="external" href="http://en.wikipedia.org/wiki/JavaScript#Uses_outside_web_pages">در خیلی از محیطهای غیر مرورگری</a> مانند <a class="external" href="http://nodejs.org/">node.js</a> یا <a href="http://couchdb.apache.org">Apache CouchDB</a> نیز استفاده شده است. زبان اسکریت نویسی آن <a class="mw-redirect" href="https://en.wikipedia.org/wiki/Prototype-based" title="Prototype-based">مبتنی بر نمونه</a> است، <a href="/en-US/docs/multiparadigmlanguage.html" title="/en-US/docs/multiparadigmlanguage.html">چند نمونه</a> که پویا است،<span style="color: rgb(102, 102, 102); line-height: 21px;"> </span><a href="https://en.wikipedia.org/wiki/Type_safety" style="line-height: 21px;" title="Type safety">نوع امن</a><span style="line-height: 1.572;"> و از شی گرایی پشتیبانی میکند، سبک های برنامه نویسی تابعی را دارد. اطلاعات بیشتر را میتوانید از صفحه <a href="/fa/docs/docs/Web/JavaScript/About_JavaScript">درباره جاوااسکریپت</a></span><span style="line-height: 1.572;"> مشاهده نمایید.</span></p> - -<p dir="rtl">استاندارد جاوااسکریپت <a href="/fa/docs/JavaScript/Language_Resources">اکمااسکریپت</a> (<a href="/fa/docs/JavaScript/Language_Resources">ECMAScript</a>) است که از سال ۲۰۱۲ تمامی مرورگرهای مدرن استاندارد اکمااسکریپت نسخه ۵.۱ را به صورت کامل پشتیبانی میکنند، همچنین مرورگرهای قدیمیتر نسخه ۳ از اکمااسکریپت را پشتیبانی میکنند. از ماه June سال ۲۰۱۵ اکمااسکریپت ۶ (ES6) یا همان اکمااسکریپت ۲۰۱۵ (ES2015) مورد قبول واقع شده است. توضیحات تکمیلی در مورد اکمااسکریپت ۶ را می توانید در <a class="external" href="http://wiki.ecmascript.org/doku.php?id=harmony:proposals">dedicated wiki</a> مشاهده نمایید.</p> - -<p dir="rtl">این بخش از سایت به زبان جاوااسکریپت اختصاص داده شده است، قسمتهایی که مختص به صفحات وب، یا دیگر محیطهای میزبانی نیست. برای اطلاعات در مورد APIهای خاص برای صفحات وب، لطفا <a href="/fa/docs/DOM">DOM</a> را ببینید. در مورد اینکه چگونه DOM وJavaScript با همدیگر مناسب هستند در <a href="/fa/docs/Gecko_DOM_Reference/Introduction#DOM_and_JavaScript">مرجع DOM</a> اطلاعات بیشتری را بخوانید.</p> - -<p dir="rtl">JavaScript به صورت <strong>«جاواسکریپت»</strong> خوانده میشود، ولی در فارسی به صورت <strong>«جاوااسکریپت»</strong> ترجمه میشود و اگر به صورت «جاوا اسکریپت» ترجمه شود اشتباه است چون دو کلمه جدا از هم نیست و اگر به صورت دو کلمه جدا نوشته شود خطلاهای نگارشی ایجاد میشود، به طور مثال ممکن است کلمه جاوا در انتهای خط و کلمه اسکریپت در ابتدای خط بعدی نوشته شود.</p> - -<div class="row topicpage-table" dir="rtl"> -<div class="section"> -<h2 class="Documentation" id="مستندات">مستندات</h2> - -<dl> - <dt><a href="/fa/docs/Web/JavaScript/Guide">راهنمای جاوااسکریپت</a></dt> - <dd>اگر شما در جاوااسکریپت تازهکار هستید، باید این راهنما را بخوانید.</dd> - <dt><a href="/fa/docs/Web/JavaScript/Reference">مرجع جاوااسکریپت</a></dt> - <dd>این مرجع جاوااسکریپت شامل مستندات کاملی برای جاوااسکریپت نسخه ۱.۵ و بهروزرسانیهای آن است.</dd> -</dl> - -<h3 id="مقالات_معرفی">مقالات معرفی</h3> - -<dl> - <dt><a href="/fa/docs/Web/JavaScript/JavaScript_technologies_overview">نمای کلی تکنولوژیهای جاوااسکریپت</a></dt> - <dd>آشنایی با چشم انداز جاوااسکریپت برای مرورگر</dd> -</dl> - -<h3 id="مقالات_پیشرفته">مقالات پیشرفته</h3> - -<dl> - <dt><a href="/fa/docs/Web/JavaScript/Data_structures">ساختارهای دادهای جاوااسکریپت</a></dt> - <dd>نمای کلی ساختارهای دادهای قابل دسترس در جاپااسکریپت</dd> - <dt><a href="/fa/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain">وراثت و زنجیره نمونه</a></dt> - <dd>توضیح ارثبری مبتنی بر نمونه که بهصورت گستردهای اشتباده و ناچیز شمرده شده است</dd> -</dl> - -<h3 id="مقالات_دیگر">مقالات دیگر</h3> - -<dl> - <dt><a href="/fa/docs/Web/Guide/HTML/Canvas_tutorial">آموزش بوم نقاشی</a></dt> - <dd><canvas> یک المان HTML5 است که برای رسم گرافیکها با استفاده از اسکریپت نویسی استفاده میشود. آن میتواند، برای مثال برای رسم گرافیکها، ترکیب عکس و یا انجام ساده (و نه خیلی ساده) انیمیشنها استفاده شود.</dd> - <dt><a href="/fa/docs/Web/JavaScript/Language_Resources">مراجع زبان جاوااسکریپت</a></dt> - <dd>شرح زبان جاوااسکریپت استاندارد.</dd> - <dt><a class="external" href="http://msdn.microsoft.com/en-us/library/ff405926.aspx">مستندات پشتیبانی استانداردهای اینترنت اکسپلورر</a></dt> - <dd>مایکروسافت مستنداتی منتشر کرده است که "تغییرات، توضیحات، و الحاقیات برخی استانداردهای مورد تایید پشتیبانی شده توسط اینترنت اکسپلورر." را شرح میدهد، بعضی از آنها مربوط به جاوااسکریپت هستند:</dd> - <dd> - <ul> - <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff520996.aspx">[MS-ES3]: Internet Explorer ECMA-262 ECMAScript Language Specification Standards Support Document </a></li> - <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff521046.aspx">[MS-ES3EX]: Microsoft JScript Extensions to the ECMAScript Language Specification Third Edition </a></li> - <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff960769.aspx">[MS-ES5]: Internet Explorer ECMA-262 ECMAScript Language Specification (Fifth Edition) Standards Support Document </a></li> - <li><a class="external" href="http://msdn.microsoft.com/en-us/library/ff955363.aspx">[MS-ES5EX]: Internet Explorer Extensions to the ECMA-262 ECMAScript Language Specification (Fifth Edition)</a></li> - </ul> - </dd> -</dl> - -<p><span class="alllinks"><a href="/en-US/docs/tag/JavaScript">View All...</a></span></p> -</div> - -<div class="section"> -<h2 class="Tools" id="ابزارها_منابع_پیشرفته">ابزارها & منابع پیشرفته</h2> - -<ul> - <li><a href="/fa/docs/Tools">ابزارهای توسعه فایرفاکس</a> - ابزارهای عالی تعبیه شده در فایرفاکس.</li> - <li><a href="http://koding.com">Koding</a> پلت فرم توسعه آنلاین با پشتیبانی جاوااسکریپت</li> - <li><a href="http://www.learnstreet.com/">LearnStreet</a> - آموزشها و تمرینهای عملی رایگان آنلاین.</li> - <li><a href="http://www.codecademy.com/">Codecademy</a> - دوره جاوااسکریپت رایگان با مشکلات تعاملی</li> - <li><a href="http://codeschool.com">Code School </a>- یادگیری بوسیله انجام دادن، چندین دوره جاو.ا اسکریپت</li> - <li><a href="http://frontendmasters.com/" title="http://frontendmasters.com/">Frontend Masters</a> - فیلمهای کارگاه آموزشی جاوااسکریپت و توسعه وب نهایی</li> - <li><a href="http://www.letscodejavascript.com/" title="http://www.letscodejavascript.com/">Let’s Code: Test-Driven JavaScript</a> - سریهای ضبط خیلی دقیق صفحه، توسعه حرفهای جاوااسکریپت</li> - <li><a class="link-https" href="https://github.com/rwldrn/idiomatic.js">Idiomatic.js</a> - اصول نوشتن جاوااسکریپت استوار، اصطلاحی</li> - <li><a href="/en-US/docs/JavaScript/Memory_Management">Memory Management in JavaScript</a> . نمای کلی از چگونگی عملکرد حافظه در جاوااسکریپت</li> - <li><a class="external" href="http://www.getfirebug.com/">Firebug</a> - اشکالزدایی و پروفایلینگ جاوااسکریپت</li> - <li><a href="/en-US/docs/Venkman">Venkman</a> - دیباگر جاوااسکریپت</li> - <li><a href="/en-US/docs/JavaScript/Shells">JavaScript Shells</a> - تست قطعه کدهای کوچک</li> - <li><a class="external" href="http://jshint.com">JSHint</a> - ابزاری که در تشخیص خطا و مشکلات بالقوه در کد جاوااسکریپت شما کمک میکند</li> - <li><a class="external" href="http://www.jslint.com/lint.html">JSLint</a> - چک کننده نحو، در برابر اعمال بد هشدار میدهد</li> - <li><a class="external" href="http://usejsdoc.org/">JSDoc</a> - تولید مستندات از کد</li> - <li><a class="external" href="http://online-marketing-technologies.com/tools/javascript-redirection-generator.html" title="JavaScript Redirect">JavaScript Redirect</a> - ابزار تغییر مسیر پیشرفته جاوااسکریپت</li> - <li><a class="external" href="http://www.aptana.com">Aptana Studio</a> - <span id="result_box" lang="fa"><span class="hps">IDE</span> <span class="hps">متن باز</span> <span class="hps">با</span> پشتیبانی <span class="hps">آژاکس</span> <span class="hps">و</span> <span class="hps">جاوااسکریپت</span> <span class="atn hps">(</span><span>بر اساس</span> eclipse<span>)</span></span></li> - <li><a class="external" href="http://netbeans.org/features/javascript/">Netbeans</a> - IDE متن باز شامل پشتیبانی پیچیده از جاوااسکریپت</li> - <li><a class="external" href="http://www.eclipse.org/downloads/packages/eclipse-ide-javascript-web-developers/heliossr1">Eclipse</a> - IDE متن باز شامل جعبه ابزار توسعه جاوااسکریپت</li> - <li><a class="external" href="http://www.c9.io">Cloud9 IDE</a> - IDE متن باز که در مرورگر اجرا شده با قابلیت پشتیبانی از جاوااسکریپت و Node.js</li> - <li><a class="external" href="http://prettydiff.com/">Pretty Diff </a>- یک ابزار متفاوت برای مقایسه کد خرد شده با کد معمولی</li> - <li><a href="http://www.objectplayground.com/" title="http://www.objectplayground.com/">Object Playground</a> - ابزاری برای درک شیگرایی جاوااسکریپت</li> - <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/7434">Extension Developer's Extension</a> - محیط و شل JS را ارایه میدهد</li> - <li><a href="http://boilerplatejs.org/">BoilerplateJS</a> - مرجع معماری برای پروژههای جاوااسکریپت در مقیاس بزرگ</li> - <li><a href="http://www.jsfiddle.net/">JSFiddle</a> - مورد استفاده برای آزمایش و اصلاح وب سایت با جاوااسکریپت آنلاین. </li> - <li><a href="/fa/docs/JavaScript/Other_JavaScript_tools">دیگر ابزارهای جاوااسکریپت</a></li> -</ul> - -<p><span class="alllinks"><a href="/en-US/docs/tag/JavaScript:Tools">نمایش همه...</a></span></p> - -<h2 class="Community" id="Other resources" name="Other resources">دیگر منابع</h2> - -<dl> - <dt><a class="external" href="http://bonsaiden.github.com/JavaScript-Garden">JavaScript Garden</a></dt> - <dd>سایتی با اطلاعات مفید در مورد قطعات داخلیتر جاوااسکریپت.</dd> - <dt><a class="link-https" href="https://github.com/bebraw/jswiki/wiki">JSWiki</a></dt> - <dd>یک ویکی مبتنی بر Githubکه منابع و کتابخانهها را ایندکس گذاری کرده است.</dd> - <dt><a href="http://stackoverflow.com/questions/tagged/javascript">Stack Overflow</a></dt> - <dd>یک سایت همکاری ساخته و نگهداری شده Q&A و میتوانید برای جواب سوال خودرا در آن جستجو کنید. اگر جواب سوال خودرا پیدا نکردید میتوانید سوال خودرا در آنجا مطرح کنید.</dd> - <dt><a href="http://pineapple.io/resources/tagged/javascript?type=tutorials&sort=all_time">Pineapple · JavaScript</a></dt> - <dd>یک پایگاه داده بزرگ از آموزش و منابع حال حاضر جاوااسکریپت.</dd> - <dt><a href="http://lifeofjs.com">Life of JavaScript</a></dt> - <dd>منابع عالی در مورد جاوااسکریپت شامل کتاب، ارایهها، فیلمها، فیدها، سایتها، کتابخانهها، محیطهای کاری، ابزارها که در یکجا جمع آموری شده است.</dd> -</dl> - -<h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">موضوعات مرتبط</h2> - -<ul> - <li><a href="/fa/docs/AJAX">AJAX</a>, <a href="/fa/docs/DOM">DOM</a>, <a class="internal" href="/fa/docs/JavaScript/Server-Side_JavaScript">Server-Side JavaScript</a>, <a href="/fa/docs/DHTML">DHTML</a>, <a href="/fa/docs/Mozilla/Projects/SpiderMonkey">SpiderMonkey</a>, <a href="/fa/docs/HTML/Canvas">Canvas</a>, <a href="/fa/docs/JavaScript/JQuery">JQuery</a></li> -</ul> -</div> -</div> - -<p dir="rtl" lang="en-US">*JavaScript is a trademark or registered trademark of Oracle in the U.S. and other countries.</p> |