من أجل السجل ، يمكن استخدامه في المستقبل ، ويمكن أن يستخدمه زملاء الطاويين المحتاجين أيضًا.
لا ، أولاً على التقديم
ما سبق هو الاداءات. يمكنك تغيير الصورة في الزاوية اليمنى العليا بنفسك. لن أضع مادة الصورة عليها ، لذلك سأضيف الرمز فقط. الأمر بسيط للغاية ، CSS و JS. يجب أن يفهمها المبتدئون.
</pre> <pre name = code class = html> <! doctype html public -// w3c // dtd xhtml 1.0 transitional // en http://www.w3 xmlns = http: //www.w3.org/1999/xhtml> <head> <meta http-equiv = content-type content = text/html ؛ charset = utf-8/> <title> unded document </title> <type type = text/css> .divx {z-index: 200 ؛ -Moz-Border-Radius: 20px ؛ -webkit-border-Radius: 20px ؛ ارتفاع الخط: 10 بكسل ؛ محاذاة النص: المركز ؛ خط الرصيف: جريئة ؛ المؤشر: مؤشر. حجم الخط: 10 بكسل ؛ Display: None ؛} </style> </head> <body> <form id = form style = margin-top: 20px ؛> <div id = img_div_1> <input type = file id = file_input οChange = addFile (this) ؛ style = display: none /> <div style = position: relative ؛> <img id = file_img src = add_img.png width = 75 οClick = file_input.click () ؛ الارتفاع = 65/> </div> <div class = divx id = img_zindex_div_1 οnclick = del ()> <img src = no.png width = 16 height = 16/> </div> </form> </body> <script src = jquery -1.7. addFile (ths) {var objurl = getObjecturl (ths.files [0]) ؛ var left = $ ('#file_img'). position (). left ؛ var top = $ ('#file_img'). position (). top ؛ $ ('#img_zindex_div_1'). }) ؛ $ ('#file_img'). attr (src ، objurl) ؛} function del () {Alert (delete) ؛} getObjecturl (file) {var url = null ؛ if (window.createObjecturl! = undefined) {// basicurl = window.createObjectUrl (file) ؛} آخر إذا (window.url! = undefined) {// mozilla (firefox) url = intervox.url.createObjecturl (file) ؛} if ( window.webkiturl.createObjecturl (ملف) ؛} إرجاع url ؛} </script> </html>انجزها. انتهى العمل. انسخ الرمز واستبدل مادة الصورة ويمكنك استخدامه مباشرة
النزول من العمل. يترك
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
تجديد. منذ اليسار 0
احصل عليه بطريقة أخرى
var objurl = getObjectUrl (ths.files [0]) ؛ var left = $ ('#file_img'). الإزاحة (). اليسار ؛ var top = $ ('#file_img'). الإزاحة (). أعلى ؛ اليسار هو المسافة اليسرى من الصورة الافتراضية. يمكن استخدام الصورة المضافة وفقًا لعرض الصورة الافتراضية - حذف عرض صورة الطبقة (أي ، عرض الصورة الافتراضي الحالي هو 75 ، وعرض الصورة للطبقة الحذف هو 16 ، اليسار = 75 - 16 ، يمكن للموضع الوصول إلى أقصى اليمين من الصورة! TOP: TOP - 5 ، العرض: Block}) ؛ لخصهذه هي المقالة حول HTML+CSS التي تنفذ الزاوية اليمنى العليا من الصورة مع زر حذف شوكة وحذف الصورة. لمزيد من صور HTML ذات الصلة مع المحتوى المحذوف ، يرجى البحث عن المقالات السابقة من Wulin.com أو متابعة تصفح المقالات ذات الصلة أدناه. آمل أن يدعم الجميع wulin.com في المستقبل!