يعرض jQuery onMouseover صورة/رابط div في نفس الموضع (تلميح الأدوات)
-
06-07-2019 - |
سؤال
أريد تحوم فوق صورة -> في رابط
خلال الصورة ، يجب أن تنبثق (مثل تلميح الأدوات) div ، والتي يمكنني ملؤها أيضًا ببعض الأشياء - أي فكرة؟!
$ هذا هو الرابط الذي يتضمن IMG: لقد وجدت الصورة في الداخل وأردت أن تمتد على DIV فوق الصورة وجعل بعض تأثيرات jQuery التي تتيح للمستخدم الحصول على المعلومات ، والتي تنقر على الصورة في توسيعها
$(this).parent().append($("<div/>")
.css({ "display" : "block", "left" : img.x, "top" : img.y,
"width" : img.width, "heigth" : img.heigth, "border" : "1px solid red"})
.text("Click me!")
لا يعمل :-/
المحلول
أعتقد أنك تبحث عن وظيفة تلميح الأدوات ، وهناك بعض الإضافات الهادئة للملابس المتوفرة بالفعل ، حتى مع المحتوى المخصص أو النص أو النص المنسق أو التخطيط المخصص أو حتى محتوى Ajax.
ألقِ نظرة على أحد هذه الإضافات:
- المكون الإضافي qtip: http://craigsworks.com/projects/qtip/
- Tool Tooltip Jquery: http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/
- Simpletip: http://craigsworks.com/projects/simpletip/
- Cluetip: http://plugins.learningjquery.com/cluetip/
- wtooltip: http://wayfarerweb.com/wtooltip.php
البعض لديه خيارات أكثر من الآخر ، لقد استخدمت SimpleTip لبعض المواقع وعرضها على الرغم من محتوى محدود ، ما تريده ربما يكون أكثر مثل QTIP
لا تنتمي إلى StackOverflow