আমরা সবাই আমাদের ব্লগ বা ওয়েবসাইটকে অনেক সুন্দর করে সাজানোর চেস্টা করি,
নতুন কিছু আবিস্কার করার আশাকরি। আমরা প্রত্যেকে আমাদের ব্লগ বা সাইডে Social Network যুক্ত করে থাকি।
আমরা সেই Social Network এর জন্য বিভিন্ন রকমের ডিজাইন করে থাকি, সেটা যদি হয় অন্য ধরনের ডিজাইনের তাহলে কেমন হবে?
স্যাম্পল দেখুন।
যাই হোক,
চলুন ডিজাইনটা তৈরী করে ফেলি। তৈরী করতে যা যা করতে হবে -
প্রথমে আপনার কম্পিউটার এর নোটপ্যাড ওপেন করুন অতঃপর নিচের কোডটি Copy করে Past করুন,
তারপর Save As করুন index.html অথবা আপনারইচ্ছা.html এই নামে। এরপর সেই HTML ফাইল টি ওপেন করুন।
আর অবশ্যই কিছু জানার থাকলে বা নাবুঝলে Comments করবেন।
"আর একটি কথাঃ
আপনার একটি Like বা Comment আমাকে আনেক বেশী উৎসাহ জোগাবে আপনাকে নতুন কিছু শেখানোর।♥♥"
আমার ওয়েব ডিজাইন পেইজ।
কোডটিঃ
<!DOCTYPE html>
<head>
<title>facebook.com/WebsiteDevelop</title>
<style id="page-skin-1" type="text/css">
<!--
#sidebar-wrapper {
width: 310px;
padding: 0 5px 10px 0;
float: right;
word-wrap: break-word;
overflow: hidden;
}
h2 {
font-size:140%;
padding:4px 0 0px 3px;
margin: 0 0 2px 0;
color: #444;
font-weight: 800;
}
.bub{
text-decoration:none;
text-align:center;
position:absolute;
top:200px;
left:200px;
width:60px;
height:60px;
background-color:#33CCFF;
border-radius:50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
font-family: Calibri, Helvetica, sans-serif;
font-size:130%;font-weight:bold;
line-height:1.8em;
color:#FFf;
}
.bub:hover{
top:130px; left:130px; width:200px; height:200px; border-radius:400px;
-moz-border-radius: 400px;
-webkit-border-radius: 400px;
-webkit-transition: ease 1s;
-moz-transition: ease 1s;
z-index:10;
}
.bub i{
top:12px; position:relative; font-size:90%; text-transform:none;
}
.bub span{
display:none;
position:relative;
top:80px;
text-decoration:none;
}
.bub:hover span{
display:block;
}
--></style>
<script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script>
</head>
<body>
<div id="sidebar-wrapper">
<div>
<a href="http://twitter.com/YOUR_USERNAME">
<i>Twitter</i>
<span>Follow me<br>on twitter</span>
</a>
<a href="http://facebook.com/YOUR_USERNAME" style="margin-left: 50px; background-color: rgb(59, 89, 152);">
<i>Facebook</i>
<span>Be Friend<br>on facebook</span>
</a>
<a href="http://feeds.feedburner.com/YOUR_USERNAME" style="margin-left: 100px; background-color: rgb(241, 94, 40);">
<i>RSS</i><span>Get Free Update<br>via RSS</span>
</a>
<a href="http://in.linkedin.com/YOUR-LINK" style="margin-left: 150px; background-color: rgb(96, 170, 206);">
<i>LinkedIn</i>
<span>Add me<br>to your Network</span>
</a>
</div>
</body>
</html>
আমি এম কে এইচ তানভীর। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 12 বছর 9 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 3 টি টিউন ও 34 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 0 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।
শিখতে ভালোবাসি, আর ভালোবাসি শেখাতে। চেষ্টা করি নতুন কিছু সৃষ্টি করতে।
Onak valo post….Keep doing…Amar blog a visit korle valo lagto: http://www.healthandbeauty-care.com
কমেন্টসের কৃতজ্ঞ।
বেশী কৃতজ্ঞ Kazirhut ভাইয়ের কাছে। ভালো নালাগারি কথা।
কারণ ভালো লাগার জন্য ভাল মন লাগে।
ধন্যবাদ Kazirhut ভাই।
@এম কে এইচ তানভীর: ভাই আমার কাছে অনেক ভাল লেগেছে । ভাবতেসি আমার সাইট এ ইউস করব । কি বলেন ? ধন্যবাদ আপনাকে । সামনে এরকম কিছু আনকমন পোস্ট যে আমরা পাই । মনে থাকবে ত ভাই ?
জট্টিল ভাই, চালিয়ে যান । নিন্দুকের নিন্দায় কর্নপাত করবেন না। তাদের নিন্দার খেতাপুরি। (এটা আবার খাওয়ার পুরি না )
নিন্দা ত করবেই, কাজ না করলে নিন্দা করবেনা?
ফালতু টিউন আর টিউনার। কাজ করেনা। টিউন করার আগে একবার নিজে ট্রাই করে দেখে নিবেন।
![jQuery for Web Design [পর্ব-০৪] :: jQuery এর FadeIn FadeOut মেথড জানবো ও ব্যবহার করে দেখব](https://dnc.techtunes.io/tDrive/tuner/2018/04/techtunes_fee81aa370998cccf57ea2d7dc08eaa8-368x207.jpg "jQuery for Web Design [পর্ব-০৪] :: jQuery এর FadeIn FadeOut মেথড জানবো ও ব্যবহার করে দেখব")
স্যাম্পল দেখান!