Write Post

online-tutor

Top Ads

Bottom Notification

 


Easy Use Of ToolTip Code!
A tooltip is a graphical user interface (GUI) element used in conjunction with the cursor or mouse pointer to display information about an item without needing to click on it. The typical scenario for summoning a tooltip is to hover the mouse cursor over another GUI element such as a tool icon in software application, and it is also prevalently used in websites. A tooltip is also known as a hint, infotip or screentip. Depending on the application, the tooltip can display anything from the full name of the object the mouse is hovering on, to displaying additional information or a detailed explanation on what that tool or object does. For example, in Windows Explorer when hovering the mouse over a file, the details of that file such as the format type, size and date modified fields are displayed, and hovering the mouse over the local drive partition displays the free space and total size of the drive. Microsoft refers to their tooltips as "ScreenTips." They are called tooltips because they are usually implemented to provide contextual and usage information to the various tools in an application without having to consult lengthy manuals and other documentation. How a tooltip is implemented, whether it is a type of hover box or a separate window, is entirely up to the developer of the software. Some applications even use their tooltips as a menu for changing the settings of the tool the mouse is hovering on. Tooltips are commonly seen and implemented in desktop applications and not on mobile because there is no hover function for touch screens. However, Samsung was able to implement a hover function, and hence tooltips, on some of their mobile devices which used the S-Pen.
<!-- CSS Style CODE Start -->

<style>
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 2px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 400px;
  background-color: blue;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  margin-left: -200px;
  padding:10px;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left:50%;
  margin-left: -55px;
  border-width: 5px;
  border-style: solid;
  border-color: blue transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}
</style>
 

Hover over me: when you hold cursor on it , it will show tooltip box.

Tooltip text: it will show your written text .


Note: Sometimes Div can be seen separetely. That time you can use alternative (span) code. 

<div class="tooltip">Hover over me
  <span class="tooltiptext">Tooltip text</span>
</div>

alternative:
<span class="tooltip">Hover over me
  <span class="tooltiptext">Tooltip text</span>
</span>

Close

Post a Comment

Use Comment Box ! Write your thinking about this post and share with audience.

Previous Post Next Post

Sponsord

Sponsord

Help:

FAQs:

How to download any file from this website ?

You can download all the files on our site. We usually share the link of Google Drive from here you can securely and very quickly collect any PDF or all other files. One more thing to keep in mind is that this site does not post any kind of fake download, so wherever you see PDF download or file download, remember that you can download your desired PDF or other files from that post. Each download button has a timer attached. Basically, it takes some time for the files to be ready, so the download timer is given. There may be some automatic download timers, in which case there is nothing to be afraid of when you see the timer. There will be no accident when the timer runs out. Wait there with some of your precious time.

এই ওয়েবসাইট থেকে যেকোনো ফাইল কিভাবে ডাউনলোড করবেন ?

অনেকে আছেন যারা অযথা কমেন্ট করে জিজ্ঞাসা করেন কিভাবে ডাউনলোড করব তাদের উদ্দেশে বলে দেয় আমাদের এই সাইটের সকল ফাইল আপনি অবশ্যই ডাউনলোড করতে পারবেন । আমরা সাধারণত গুগোল ড্রাইভ এর লিংক শেয়ার করে থাকি এখান থেকে আপনি নিরাপদ এবং খুব দ্রুত যেকোনো পিডিএফ বা অন্যান্য সকল ফাইল সংগ্রহ করতে পারবেন । আর একটি কথা বলে রাখা দরকার এই সাইটটি কোন প্রকার ফেইক ডাউনলোড পোস্ট করে থাকে না সুতরাং যেখানে দেখবেন পিডিএফ ডাউনলোড বা ফাইল ডাউনলোডের কথা বলা আছে মনে রাখবেন আপনি অবশ্যই সেই পোষ্টটি থেকে আপনার কাংখিত পিডিএফ বা অন্যান্য ফাইল গুলো ডাউনলোড করে নিতে পারবেন । প্রতিটি ডাউনলোড বাটনে একটি টাইমার সংযুক্ত করা আছে । মূলত ফাইল গুলো প্রস্তুত হতে বেশ কিছুটা সময় লাগে সেকারণে ডাউনলোড টাইমার দেওয়া হয় । কিছু কিছু স্বয়ংক্রিয় ডাউনলোড টাইমার থাকতে পারে, সেক্ষেত্রে টাইমার দেখলে ভয় পাবার কিছু নেই টাইমার শেষ হলে কোন দুর্ঘটনা ঘটবে না আপনার মুল্যবান সময়ের কিছুটা দিয়ে সেখানে অপেক্ষা করুন টাইমার পুরোপুরি শেষ হলে ডাউনলোড বাটন পেয়ে যাবেন ।