احضرت
لكم كود CSS
لفتح
عنصر
اخر المواضيع او اي عنصر اخر بمجرد مرور الماوس عليه
واخذت لكم
عينة
لاخر المواضيع
صورة للكود
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
وعند مرور الماوس على صورة المواضيع الاخير
تفتح
تلقائيا
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]
ما عليك سوى
الذهاب
الى لوحة الادارة
مظهر
المنتدى
الالوان
ورقة التصميم css
وضع هذا الكود
الرمز: |
width="90%"> |
[/b][/color]#content-container div#right { background-image: url('https://i.servimg.com/u/f40/16/60/81/99/top_1010.png'); background-position: right top; background-repeat:no-repeat; padding-right: 30px; margin: 0px; width: 80px; height: 200px; font-size: 0px; float: left; overflow: hidden; } #content-container div#right:hover { width: 180px; height: 225px; font-size: 12px; font-weight: bold; float: left; overflow: hidden; border-top: 2px double #000000; border-right: 2px double #000000; border-bottom: 2px double #000000; border-left: 0px double #; padding: 0px; } #right { position: absolute; position: fixed; left: -80px; top: 40%; overflow: hidden; } #right:hover { position: absolute; position: fixed; left: 0px; top: 40%; overflow: hidden; } #right div.borderwrap div.box-content { background-image: url('https://i.servimg.com/u/f40/16/60/81/99/top_1010.png'); background-position: left top; background-repeat: no-repeat; margin-top: 0px; padding-top: 0px; padding-left: 20px; } #right div.borderwrap div.box-content .row1 { background-image: none; background-color: transparent; border: none; width: 50%; margin-top: 0px; padding-top: 0px; line-height: 149%; } #right div.borderwrap div.box-content .row2 { background-image: none; background-color: transparent; border: none; width: 50%; padding-top: 0px; margin-top: 0px; line-height: 149%; } /* Google Chrome and Safari 3.1 */ body:nth-of-type(1) #right div.borderwrap div.box-content .row1 { background-image: none; background-color: transparent; border: none; width: 50%; margin-top: 0px; padding-top: 0px; line-height: 150%; } Chrome and Safari 3.1 */ body:nth-of-type(1) #right div.borderwrap div.box-content .row2 { background-image: none; background-color: transparent; border: none; width: 50%; padding-top: 0px; margin-top: 0px; line-height: 150%; } [color=green][b] |
الخطوى
الثانية
التوجه الى لوحة
الادارة
عناصر
اضافية
ادارة العناصر المستقلة على المنتدى
وتطبيق ما في الصورة
[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذه الصورة]