موقعي الجديد + firefox = مصيبة !

رياض القرآن · 23-10-2006, 01:43 PM

السلام عليكم ورحمة الله وبركاته ،،
تقبل الله منا ومنكم صالح الأعمال ( لازم تسيرون على هذا الموضوع http://www.swalif.net/softs/showthread.php?t=177133

)

ثانيا ..

انتهيت الحمد لله من برمجة موقعي بعد عناء أشهر ..

والمشكلة اني نسيت ان فيه شئ اسمه متصفحات أخرى فبنيت كل الموقع
على اساس انه مظهره جيد في الاكسبلورر ..

ما دري وشلون حملت قبل كم يوم نسخة firefox ولا الدعوه مب اللي انت خابر

حوسة مره ! ..

ملاحظة انا لست محترف في الـ CSS لذلك ارجو مساعدتي في اين الخطأ
والCSS جمعته من عدة مواقع يعني شئ من تأليفي وشئ من وورد بريس وشئ من مواقع اجنبية حلوة .. الخ
مع ان الموقع سليم من ناحية XHTML ...

أترك لكم التجربة
http://www.flasher.ws/main
الستايل شيت http://www.flasher.ws/main/style.php
ولا زال الموقع تجريبي لحين اصلاح المشكلة

ابو الويس · 23-10-2006, 02:21 PM

انا شايفه نفس الشي بالمتصفحين

المبدع العربي · 23-10-2006, 02:48 PM

بصراحة لا أرى أي اختلاف إلا في كلمة (التعليقات) والصورة التي بجانبها
فقط

تأكد من اصدارة الفايرفوكس التي تستخدمها

رياض القرآن · 23-10-2006, 03:02 PM

أشكركم على مروركم جميعا
ابو الويس - المبدع العربي

نعم اللي اقصده هو الصورة اللي بجانب التعليقات وكذلك في شريط القوائم في الاعلى
نافذة الأقسام تطلع مع اقصى اليمين

طبعا يمكن تعتبرونها عادية .. بس بالنسبة لي شئ آخر

شكرا لكم ..

Bo3oof · 23-10-2006, 10:41 PM

مشكلة ملفات الcss خصوصا أن بعض الأحيان تعتمد على القواعد المطبقة على الكائنات السابقة في الصفحة، لكن سنحاول بإذن الله حل مشكلتك حيث أنني لا أعرف أحل مشاكل الcss إلا لما أجربه بنفسي في المتصفحات

أما بالنسبة للقوائم فالمشكلة (حسب ظني وللعلم لا أحب أعطي آرائي بدون تجربة ولكن للحاجة أحكام) تكمن في استخدامك خاصية visibility لإخفاء العناصر، والفرق بين visibility وخاصية display هي أن عندما تقوم بإخفاء العناصر باستخدامك خاصية الvisibility فإن العنصر لا يتحرك من مكانه ويظل ثابت في الصفحة، أنت مجرد تخفيه وتظهره وهو موجود في نفس المكان، أما بالنسبة للdisplay:none واستخدامها للإخفاء فإنك تخفي العنصر تماما من الصفحة وسيتغير تموضع العنصر عندما تريد أن تظهره مرة أخرى باستخدامك display:block

أعتقد أن أفضل حل مراجعة هذه الخواص واستخدامها بالشكل المطلوب وأنصحك باستخدام الجافاسكربت لحساب تموضع القوائم مع الزر الذي يؤدي إلى بروزها.

أما بالنسبة لصورة التعليقات أعتقد من الأفضل أن تكون الخلفية للعنصر ul وليس عنصر li ، وإذا كان لابد من استخدامها لعنصر li فتكون لهذا العنصر وليس عنصر a كما أنت فاعلها وتحكم بعدها بالpadding أو الmargin للعنصر a على حسب احتياجك

هذا والله أعلم ولم أقم بتجربة أي من هذه الحلول وآسف إن كانت لا تعمل...

مع تحياتي

رياض القرآن · 24-10-2006, 08:24 AM

Bo3oof .. تسلملي بمشاركتك والله

بالنسبة ل visibility فكود الجافاسكربت المستخدم لدي يستخدم هذه الخاصية
هذا جزء من الكود

كود:

function changeObjectVisibility(objectId, newVisibility) {
    // get a reference to the cross-browser style object and make sure the object exists
    var styleObject = getStyleObject(objectId);
    if(styleObject) {
	styleObject.visibility = newVisibility;
	return true;
    } else {
	//we couldn't find the object, so we can't change its visibility
	return false;
    }
} // changeObjectVisibility

اقتباس:

أما بالنسبة لصورة التعليقات أعتقد من الأفضل أن تكون الخلفية للعنصر ul وليس عنصر li ، وإذا كان لابد من استخدامها لعنصر li فتكون لهذا العنصر وليس عنصر a كما أنت فاعلها وتحكم بعدها بالpadding أو الmargin للعنصر a على حسب احتياجك

نعم أتوقع المشكلة في الأسطر هذي :

كود:

.meta {
	margin:0.5em 0 0;
	padding:0;
	list-style:none;
	color:#666;
	font-size:0.94em;
}
.archive .meta,
.reviews .meta {margin-top:-0.5em;}
.reviews .meta {clear:both;}
.meta li {
	display:inline;
	margin:0 0 0 6px;
	padding:0 0 0 8px;
	
}
.meta li.extended,
.meta li:first-child {
	margin:0;
	padding:0;
	background:transparent;
}
.meta li.extended a {
		padding-right:12px;
	background:url(http://localhost/flasher/includes/themes/Light/images/icons/continue-rtl.gif) no-repeat 0 50%;
}
.meta li.commentinfo a {
		padding-left:14px;
	background:url(http://localhost/flasher/includes/themes/Light/images/icons/comments.gif) no-repeat 100% 50%;

	
	
}
.meta li a {border-bottom:1px dotted #cfcfa0;}

شاكر لك اهتمامك

ALMimoni · 24-10-2006, 02:56 PM

أخوي رياض القرآن
استخدم CSS لعرض قائمة الأقسام فلا حاجة للجافاسكربت.

كود:

#list{
display: none;
position: absolute;//مهم لكي تظهر القائمة بجانب الزر
وتحط الخصائص الأخرى للقائمة
}

#list:hover{
display: block;
}

رياض القرآن · 26-10-2006, 05:02 PM

اقتباس:

المشاركة الأصلية كتبت بواسطة ALMimoni

أخوي رياض القرآن
استخدم CSS لعرض قائمة الأقسام فلا حاجة للجافاسكربت.

كود:

#list{ display: none; position: absolute;//مهم لكي تظهر القائمة بجانب الزر وتحط الخصائص الأخرى للقائمة } #list:hover{ display: block; }

الميموني .. مشكور على المداخلة

بس تقدر تقولي بالضبط وش اعدل ؟

كود بلغة HTML:

<li> <div id="myLabel1"><a href="#" onmouseover="return !showMenuTest('1', event, 'myLabel1');" >الأقسام </a></div> <div id="myMenu1" class="menu_item" onmouseover="event.cancelBubble = true;"> <table border="0" cellspacing="0" cellpadding="0" width="200" bgcolor="#DB801A"> <tr> <td  height="15" width="200" > <a href="index.php?go=cat&amp;cat=1" style="border:none;float:none; width:200">تدوين</a> </td> </tr> </table> </div> </li>

والCSS سبق ارفقته .. مشكور

ALMimoni · 26-10-2006, 11:28 PM

السلام عليكم
أخوي رياض القرآن ما يحتاج تستخدم جدول في القائمة

كود بلغة HTML:

<style>
#menu span {	
	display:none;
}
#menu:hover span{	
	display: block;
	position: absolute;
	width: 200px;	
	padding: 5px;	
	border: 1px solid yellow;
	color: yellow;
	background-color:#691D10;
}
li a{
	color: yellow;
}
</style> <div id="menu">parts

<span> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> </span> </div>

رياض القرآن · 27-10-2006, 12:57 PM

اقتباس:

المشاركة الأصلية كتبت بواسطة ALMimoni

السلام عليكم
أخوي رياض القرآن ما يحتاج تستخدم جدول في القائمة

كود بلغة HTML:

<style> #menu span { display:none; } #menu:hover span{ display: block; position: absolute; width: 200px; padding: 5px; border: 1px solid yellow; color: yellow; background-color:#691D10; } li a{ color: yellow; } </style> <div id="menu">parts <span> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> <li><a href="#">tadween</a></li> </span> </div>

وعليكم السلام ورحمة الله وبركاته ،،

أخوي الميموني ماقصرت

بس تبين لي انها ماتشتغل مع اكسبلورر 6 ...
يعني زان في الفايرفوكس وخرب هذا

عالعموم ماقصرت

شكلي بلغي شئ اسمه قائمة منسدله واخليها منسدله انسدال تام على اليمين

أدوات الموضوع
مشاهدة صفحة طباعة الموضوع أرسل هذا الموضوع إلى صديق