مسج أدوات تراكب CSS الصراع، صورة ضعه تحت تراكب

Question

والأولى هنا هو ما أنا باستخدام وتحاول أن تفعل:

وعلى الحد الأدنى من الإعداد لهذا الأثر: flowplayer.org/tools/demos/overlay/index.html

وثم أبل ليوبارد معاينة تأثير: flowplayer.org/tools/demos/overlay/apple.html

والآن ها هي الصفحة أواجه هذه المسألة مع http://gentle-mist-64.heroku.com/pictures

وبلدي العدد: عند النقر على صورة يظهر في الصورة تحت غطاء وعلى الجانب الأيمن،

وهذا يجب أن يكون هناك صراع بين قائمتي المواقع CSS لتحديد المواقع المساعد.

وعندما أحاول ذلك على صفحة فارغة مع عدم وجود تخطيط، وأنها تعمل على ما يرام.

وتخطيط بلدي المغلق:

body {
  background: url('/images/background.jpg');
}

#image_stage {
  position: relative;
  top: 30px;
  margin: auto;
  margin-top: 75px;
  background-color: white;
  width: 900px;
  height: 520px;
}

#image_inside_stage {
  float: left;
  margin-top: 7px;
  margin-left: 27px;
}

#logo {
  position: absolute;
  left: 725px;
  top: 4px;
}

#see_through_box {
  position: absolute;
  background-color: black;
  opacity: 0.66;
  -moz-opacity: 0.66;
  filter:alpha(opacity=66);
  width: 665px;
  height: 432px;
  margin: 45px;
  z-index: 99;

  -moz-border-radius-topleft: 15px;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomleft: 0;
  -moz-border-radius-bottomright: 15px;

  -webkit-border-top-left-radius: 15px;
  -webkit-border-top-right-radius: 0;
  -webkit-border-bottom-left-radius: 0;
  -webkit-border-bottom-right-radius: 15px;
}

.inner_content {
  position: absolute;
  top: 75px;
  left: 75px;
  z-index: 99;
  color: whitesmoke;
}

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

وأنا أقدر أي مساهمة، وذلك بفضل. عامي

Answer 1

ولقد وجدت أن تماما لأداة مسج، من المهم جدا عدم وضع العنصر أدوات مسج في العنصر الأصل أن يتم وضع absolutly.

ويمكنك ببساطة وضع الإطار، تمرير، أو أيا كان الجانب خارج الوالد المطلق.

وأفضل لوضع مع يطفو كانت تستطيع.

Answer 2

هل يمكنك محاولة تحريك photo0 وphoto1 أن لا يكون ضمن عناصر div الأخرى الخاصة بك، ولكن بدلا من ذلك انهم لن تتأثر أي والد / الأنماط الموروثة؟ ربما أسفل فقط قبل إغلاق العلامة </body>؟

وحظا سعيدا!

Answer 3

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

$('body').append($('#mortgage_card'));

Answer 4

إذا كنت ترغب في الاحتفاظ العناصر الخاصة بك وضعه، يمكنك حل فعلا عن طريق تحريك عنصر تراكب، على النحو الذي اقترحه Funka. انظر هذه الإجابة:

مسج تراكب المواقع خاطئ