<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>فواصل &#187; بسيطه</title>
	<atom:link href="http://portal.fwasl.com/tag/%d8%a8%d8%b3%d9%8a%d8%b7%d9%87/feed/" rel="self" type="application/rss+xml" />
	<link>http://portal.fwasl.com</link>
	<description></description>
	<lastBuildDate>Wed, 16 Oct 2019 18:49:35 +0000</lastBuildDate>
	<language>ar</language>
		<sy:updatePeriod>hourly</sy:updatePeriod>
		<sy:updateFrequency>1</sy:updateFrequency>
	<generator>https://wordpress.org/?v=3.9.40</generator>
	<item>
		<title>العرض المستمر وتدوير المحتوي باستخدام JS,CSS</title>
		<link>http://portal.fwasl.com/%d8%a7%d9%84%d8%b9%d8%b1%d8%b6-%d8%a7%d9%84%d9%85%d8%b3%d8%aa%d9%85%d8%b1-%d9%88%d8%aa%d8%af%d9%88%d9%8a%d8%b1-%d8%a7%d9%84%d9%85%d8%ad%d8%aa%d9%88%d9%8a-%d8%a8%d8%a7%d8%b3%d8%aa%d8%ae%d8%af%d8%a7/</link>
		<comments>http://portal.fwasl.com/%d8%a7%d9%84%d8%b9%d8%b1%d8%b6-%d8%a7%d9%84%d9%85%d8%b3%d8%aa%d9%85%d8%b1-%d9%88%d8%aa%d8%af%d9%88%d9%8a%d8%b1-%d8%a7%d9%84%d9%85%d8%ad%d8%aa%d9%88%d9%8a-%d8%a8%d8%a7%d8%b3%d8%aa%d8%ae%d8%af%d8%a7/#comments</comments>
		<pubDate>Sat, 07 Jan 2012 19:44:19 +0000</pubDate>
		<dc:creator><![CDATA[مدهش]]></dc:creator>
				<category><![CDATA[jquery & java script]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[java script]]></category>
		<category><![CDATA[بسيطه]]></category>
		<category><![CDATA[تقنيه]]></category>
		<category><![CDATA[جافا سكريبت]]></category>
		<category><![CDATA[جي كويري]]></category>
		<category><![CDATA[خفيفه]]></category>
		<category><![CDATA[عرض]]></category>
		<category><![CDATA[عشوائي]]></category>
		<category><![CDATA[محتوي]]></category>

		<guid isPermaLink="false">http://www.portal.fwasl.com/?p=7268</guid>
		<description><![CDATA[عندما يجد العميل أنه من الأناقه ان يتم عرض النصوص بطريقة عشوائيه في الواجهه الرئيسيه ويطلب منك لك.فإنك تدرك جيدا ان عرض المحتوي بتلك الطريقه يكون جذابا وأنيق ولذلك لابد من أن تكون ملما بهذه التقنيه البسيطه والخفيفه لكي يصبح محتواك جذابا كما تفضله. لتحميل السكريبت اضغط هنـــــــــا لإلقاء نظره علي العض المستمر للمحتوي اضغط هنـــــــــــا أولا ...]]></description>
				<content:encoded><![CDATA[<p style="text-align: center;">عندما يجد العميل أنه من الأناقه ان يتم عرض النصوص بطريقة عشوائيه في الواجهه الرئيسيه ويطلب منك لك.فإنك تدرك جيدا ان عرض المحتوي بتلك الطريقه يكون جذابا وأنيق ولذلك لابد من أن تكون ملما بهذه التقنيه البسيطه والخفيفه لكي يصبح محتواك جذابا كما تفضله.</p>
<p style="text-align: center;">لتحميل السكريبت اضغط <a href="http://cssglobe.com/lab/random_content/random_content.zip">هنـــــــــا</a></p>
<p style="text-align: center;">لإلقاء نظره علي العض المستمر للمحتوي اضغط <a href="http://cssglobe.com/lab/random_content/02.html">هنـــــــــــا</a></p>
<p style="text-align: center;">أولا قم بوضع النص هنا علي هذا الشكل</p>
[html]
&lt;ul id=&quot;tips&quot;&gt;<br />
	&lt;li&gt;&#8230; if you want to become a better coder you need to eat your vegetables?&lt;/li&gt;<br />
	&lt;li&gt;&#8230; it takes more time to code a web page then to make a pizza?&lt;/li&gt;<br />
	&lt;li&gt;&#8230; you should validate your code?&lt;/li&gt;<br />
	&lt;li&gt;&#8230; jQuery is your friend? For real!&lt;/li&gt;<br />
	&lt;li&gt;&#8230; no matter what some people claim, you can&#8217;t learn CSS in 3 hours?&lt;/li&gt;<br />
&lt;/ul&gt;<br />
[/html]
<p style="text-align: center;">
وقم بإضافة هذا التنسيق</p>
[html]
#tips, #tips li{<br />
	margin:0;<br />
	padding:0;<br />
	list-style:none;<br />
	}<br />
#tips{<br />
	width:250px;<br />
	font-size:16px;<br />
	line-height:120%;<br />
	}<br />
#tips li{<br />
	padding:20px;<br />
	background:#e1e1e1;<br />
	display:none; /* hide the items at first only */<br />
	}<br />
[/html]
<p style="text-align: center;">
الفقرات سوف تكون مقسمه وسوف تحفظ في مكان ما علي السيرفير وسوف يتم عرضها بالترتيب عليك ان تقوم بإضافه كود الجافا كويري هذا</p>
[html]
&lt;script type=&quot;text/javascript&quot; src=&quot;js/jquery.js&quot;&gt;&lt;/script&gt;<br />
[/html]
<p style="text-align: center;">
وطبعا قم بإضافة هذا الكود الذي يقوم بوظيفة العرض بطريقة عشوائية ودوريه :</p>
[html]
&lt;script type=&quot;text/javascript&quot;&gt;</p>
<p>this.randomtip = function(){<br />
	var length = $(&quot;#tips li&quot;).length;<br />
	var ran = Math.floor(Math.random()*length) + 1;<br />
	$(&quot;#tips li:nth-child(&quot; + ran + &quot;)&quot;).show();<br />
};</p>
<p>$(document).ready(function(){<br />
	randomtip();<br />
});</p>
<p>&lt;/script&gt;<br />
[/html]
<p style="text-align: center;">
اليك الكود كاملا:</p>
[html]
&lt;script type=&quot;text/javascript&quot;&gt;</p>
<p>this.randomtip = function(){</p>
<p>	var pause = 3000; // define the pause for each tip (in milliseconds)<br />
	var length = $(&quot;#tips li&quot;).length;<br />
	var temp = -1;</p>
<p>	this.getRan = function(){<br />
		// get the random number<br />
		var ran = Math.floor(Math.random()*length) + 1;<br />
		return ran;<br />
	};<br />
	this.show = function(){<br />
		var ran = getRan();<br />
		// to avoid repeating<br />
		while (ran == temp){<br />
			ran = getRan();<br />
		};<br />
		temp = ran;<br />
		$(&quot;#tips li&quot;).hide();<br />
		$(&quot;#tips li:nth-child(&quot; + ran + &quot;)&quot;).fadeIn(&quot;fast&quot;);<br />
	};</p>
<p>	show(); setInterval(show,pause);</p>
<p>};</p>
<p>$(document).ready(function(){<br />
	randomtip();<br />
});</p>
<p>&lt;/script&gt;<br />
[/html]
<p style="text-align: center;">
وهذا هو التنفيذ عليك بالضغط <a href="http://cssglobe.com/lab/random_content/02.html">هنـــــــــا</a></p>
<p style="text-align: center;">والأن بعد قراءة هذه المقاله جيدا سوف تستطيع أن تعرض محتواك بالشكل الأنيق المناسب</p>
]]></content:encoded>
			<wfw:commentRss>http://portal.fwasl.com/%d8%a7%d9%84%d8%b9%d8%b1%d8%b6-%d8%a7%d9%84%d9%85%d8%b3%d8%aa%d9%85%d8%b1-%d9%88%d8%aa%d8%af%d9%88%d9%8a%d8%b1-%d8%a7%d9%84%d9%85%d8%ad%d8%aa%d9%88%d9%8a-%d8%a8%d8%a7%d8%b3%d8%aa%d8%ae%d8%af%d8%a7/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
