এটি document এর দৃশ্যমান(visible) element কে select করবে। ইহা hidden selector
এর ঠিক বিপরীত। যদি কোন element document এ জায়গা দখল করে তবে সেটি vilible হিসেবে বিবেচ্য হবে। vilible element এর height অথবা width অবশ্যই 0(zero) থেকে বড় হবে।
[বি:দ্র: যদি কোন element এর visibility :hidden অথবা opacity :0 থাকে তবে ঐ element টি যতক্ষন পর্যন্ত layout এ space ধরে রাখরে, ততক্ষন পর্যন্ত সেটি hidden হিসেবে বিবেচ্য হবেনা। যেমন, কোন animation এর সময়, যতক্ষন পর্যন্ত animation টি শেষ না হবে ততক্ষণ পর্যন্ত element টি visible হিসেবে বিবেচ্য হবে।
এই note টি hidden selector -এ ও দেয়া হয়েছে। :visibility এর কাজ বুঝতে সমস্যা হলে পূর্বের hidden selecto টি দেখুন ।]
উদাহরন Code :
নিম্নের উদাহরন টি সকল visible paragraph কে highlight করবে।
[sourcecode language=”html”]
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p:visible").css("background-color","red");
});
</script>
</head>
<body>
<h1>Welcome to www.tutorialbd.com</h1>
<p class="intro">My name is Sazal</p>
<p style="display:none">I live in Dhaka</p>
<p>My best friend is Programming</p>
</body>
</html
[/sourcecode]
ফলাফল(output):
………………………………………………………………………………
আলোকিত একটা সুন্দর সমৃদ্ধ পৃথিবী আমাদের প্রত্যেকেরই স্বপ্ন । আসুন আমাদের মেধা পরিশ্রম কে বিজ্ঞান সম্মতভাবে ব্যবহার করে, আমাদের স্বপ্ন পূরণে অংশ গ্রহণ করি। আজ এখানেই শেষ করলাম। “HAVE A GOOD PROGRAMMING”
আপনার পরবর্তী পোষ্টোর অপেক্ষায় থাকলাম। আর আমাকে একটু উপদেশ দিবেন কি? আমি কিভাবে ওয়ার্ডপ্রেস থিম ডেভেলপ করতে পারবো? আমার খুবু ইচছা। কিন্তু কোন ভাল সাইট বা টিউটোরিয়াল খুজে পাচ্ছি না। তাছাড়া বেশ কিছু বাঙলা টিউটোরিয়াল দেখলাম যে গুলো মানসম্মত না। আমি চাচ্ছি একটি সুন্দর থিম ডিজাইন করে ওয়ার্ডপ্রেস এর উপযোগী করতে। এক্ষেত্রে আমাকে কোথায় বা কোন সাইটে গেলে শিখতে পারবো একটু জানালে খুব উপকার হয়। আর আমি আপনারসসব টিউটোরিয়ালগুলো পড়ি এবং আমার খুব উপকার হচ্ছে।