في أحد الأيام ، كان لدي فكرة مفاجئة ، إذا كان بإمكاني استخدام مهارات المبرمج التي تعلمتها للاعتراف بصديقتي ، ألا تكون راقية وأنيقة ومحدثة؟
أفكر في ذلك وأفعل ذلك على الفور. أول شيء أفكر فيه هو تغيير ملف المضيفين وتغيير الصفحة الرئيسية للمتصفح إلى صفحة الويب التي صممتها.
عادة ما تستخدم الطالبات المحلية صفحة Baidu الرئيسية ، لذلك قمت بتقليد صفحة Baidu الرئيسية بنفسي ، والآثار المحددة هي كما يلي:
هل يبدو طويل القامة ومتميز؟ بالطبع ، فشلت في النهاية. كيف يمكن للمبرمج أن يكون لها صديقة؟
لكن لصالح أصدقائي الحريريين ، أقوم الآن بنشر هذه الرموز. حتى لو نجح شخص واحد ، سأستمر في إخفاء مزاياتي وشهراتي.
يرجى استخدام Baidu لتغيير ملف المضيفين. هذا لا يكفي.
رمز المصدر بايدو كتبه بنفسي:
نسخة الكود كما يلي:
<style>
html ، الجسم {الارتفاع: 100 ٪} html {overflow-y: auto} #wrapper {الموضع: relative ؛ _position: ؛ min-height: 100 ٪}#content {padding-bottom: 100px ؛ text-align: center} #ftcon {quight: 100px ؛ public ؛ position: 44px ؛
Auto ؛ z-index: 0 ؛ Overflow: Hidden} #ftconw {width: 720px ؛ margin: 0 auto}
body {font: 12px arial ؛ text-align: left ؛ background: #ffff}
الجسم ، P ، Form ، UL ، LI {Margin: 0 ؛ Padding: 0 ؛ Style List: None}
الجسم ، النموذج ،#fm {الموضع: النسبية} td {text-align: left} img {border: 0} a {color:#00c} a: Active {color:#f60}
.bg {background-image: url (http://s1.bdstatic.com/r/www/cache/static/global/img/icons_aea40f46.png) ؛ background-r epeat: no-repeat ؛ _background-emage: url (http://s1.bdstatic.com/r/www/cache/static/global/img/icons_cfa0bb3b.gif)}
.c-icon {display: inline block ؛ width: 14px ؛ الارتفاع: 14px ؛ align- align: text-bottom ؛ font-style: normal ؛ overflow: hidden ؛ background: url (http://s1.bdstatic.com/r/www/cache/static/global/img/Icons_aea40f40f46.png 0 ؛ _background-emage: url (http://s1.bdstatic.com/r/www/cache/static/global/img/icons_cfa0bb3b.gif)} .c-icon-triangle-down-lue {background-position: -480px
-24px} .c-icon-chevron-unfold2 {background-position: -504px -24px} #u {color:#999 ؛ padding: 4px
10px 5px 0 ؛ text-align: right} #ua {margin: 0 5px} #u .reg {margin: 0} #m {width: 720px ؛ margin: 0
Auto} #nv a ،#nv b ، .btn ،#lk {font-size: 14px} #fm {padding-left: 130px ؛ text-align: left ؛ z-index: 1} inport {border: 0 ؛ Padding: 0} #nv {height: 19px ؛ font-size: 16px ؛
0 4px ؛ text-align: left ؛ text-indent: 137px} .s_ipt_wr {width: 468px ؛ height: 30px ؛ display: inline block ؛ margin-right: 5px ؛ procession-position: 0
-288px ؛ الحدود: 1px الصلبة #B6B6B6 ؛ اللون الحدود: #9A9A #CDCDCD #CDCDCD #9A9A9A ؛ العمودي-المحاذاة: أعلى}.
arial ؛ الهامش: 5px 0 0 7px ؛ الخلفية: #ffff ؛ الخطوط العريضة: 0 ؛ -webkit-Appearance: none} .s_btn {width: 95px ؛ الارتفاع: 32px ؛ حشوة القمة: 2px/9 ؛ الخط: 14px ؛
-240px ؛ المؤشر: Pointer} .s_btn_h {background-position: -240px -240px} .s_btn_wr {width: 97px ؛ الارتفاع: 34px ؛ عرض: خلفية مضمونة ؛ خلفية: -120px
-240px ؛*الموضع: النسبية ؛ z-index: 0 ؛ align align: top} #lg img {vertical-align: top ؛ margin-bottom: 3px} #lk {margin: 33px
0} #lk span {font: 14px "安体"} #lm {height: 60px ؛ line-height: 15px} #lh {margin: 16px
0 5px ؛ تباعد الكلمات: 3px} .Tools {الموضع: absolute ؛ أعلى: -4px ؛*أعلى: 10px ؛ اليمين: 7px} #mholder {width: 62px ؛ الموضع: relative ؛ z-index: 296 ؛ عرض: none} #mcon {quight: 18px ؛ line-height: 18px ؛
span {color:#00C ؛ Cursor: Default ؛ Display: block} #mcon .hw {text-decoration: enderline ؛ cursor: pointer ؛ display: inline block} #mcon
.pinyin {display: inline-block} #mcon .c-chevron-unfold2 {margin-left: 5px} #mmenu
A {العرض: 100 ٪ ؛ الارتفاع: 100 ٪ ؛ العرض: كتلة ؛ خط الارتفاع: 22px ؛ مستودع النص: 6px ؛ إزالة النص: لا شيء ؛ فلتر: لا شيء/9}#mmenu ،#مستخدم
ul {box-shadow: 1px 1px 2px #ccc ؛ -moz-box-shadow: 1px 1px 2px #ccc ؛ -webkit-box-shadow: 1px
1px 2px #ccc ؛ مرشح: progid: dimizageTransform.microsoft.shadow (القوة = 2 ، الاتجاه = 135 ، color = "#ccccccc")/9} #mmenu {العرض: 56px ؛ الحدود: 1px
Solid#9b9b9b ؛ على أساس القائمة: لا شيء ؛ الموضع: absomute ؛ اليمين: 27px ؛ الأعلى: 28px ؛ العرض: لا شيء ؛ الخلفية: #fff} #mmenu
a: hover {background: #ebebeb} #mmenu .ln {height: 1px ؛ background: #ebebb ؛ overflow: hidden ؛ font-size: 1px ؛ line-height: 1px ؛ margin-top: -1px}#cp ،#cp
A {color:#666} #Seth {display: none ؛ background: url (#default#homepage)}#setf {display: none} #sekj {margin-left: 14px}#shouji {margin-right: 14px} #u
.last {margin-right: 0} #U .un {font-weight: Bold ؛ Margin-Right: 5px} #U ul {width: 100 ٪ ؛ background: #fff ؛ border: 1px
Solid#9B9B9B} #U LI {Height: 25px} #u li a {width: 100 ٪ ؛ الارتفاع: 25px ؛ خط الذروة: 25px ؛ عرض: block ؛ text-align: left ؛ text-decoration: none ؛ text-indent: 6px ؛ margin: 0 ؛ filter: none/9} #u.
li a: hover {background: #ebebeb} #u li.nl {border-top: 1px solid #ebebb} #User_center
.user_center_btn {margin-right: 5px} .usermenu {width: 64px ؛ الموضع: absolute ؛ اليمين: 7px ؛ _right: 2px ؛ top: 15px ؛ top: 14px/9 ؛*top: 15px ؛ padding-top: 4px ؛ عرض:
</style>
<style>
/*
نمط شعوري
*/
#M {الموضع: النسبية ؛ الحشو: 50px 0 0 0 ؛}
#newyeareve {الارتفاع: 15px ؛ الموضع: مطلق ؛ أعلى: 250 بكسل ؛ اليسار: 130px ؛ العرض: 510px ؛}
#newyeareve li {cursor: pointer ؛ العرض: 20px ؛ الارتفاع: 15px ؛ الهامش: 0 21px 0 0 ؛ float: left ؛}
#newyeareve .icon-newyear0 {background: url ("// files.vevb.com/file_images/article/201407/mylove.png")
#newyeareve .month-next {display: none! tarm ؛}
#newyeareve .icon-newyear1 {background: url ("// files.vevb.com/file_images/article/201407/mylove01.png")
#Newyeareve li: Hover {background: url ("// files.vevb.com/file_images/article/201407/mylove.gif") no -Repeat -0 0 ؛ }
#M {الموضع: النسبي ؛}
#play {الموضع: absolute ؛ top: 135px ؛ اليسار: 348px ؛ العرض: 25px ؛ الارتفاع: 25px ؛ المؤشر: مؤشر ؛}
#newyeareve .icon-newyear2 ،#newyeareve .icon-newyear1: hover {background: url ("// files.vevb.com/file_images/article/201407/mylove01.png") no-repeat center ؛}
#newyearkw {color:#e203a9 ؛ الموضع: المطلق ؛ الأعلى: 212px ؛ اليسار: 135px ؛ العرض: 300px ؛ الارتفاع: 20px ؛ اللون:#897883 ؛ z-index: 100 ؛ font-family: "microsoft yahei"
#newyearkw i ،#newyearkw img {font-style: normal ؛ الموضع: المطلق ؛ العرض: 20px ؛ الارتفاع: 20px ؛ الأعلى: 0 ؛}
#NewYearkw .IMG01 {Left: 0px ؛}
#NewYearkw .IMG02 {يسار: 180px ؛}
#newyearkw .c1 {color:#e203a9 ؛ اليسار: 20px ؛}
#newyearkw .c2 {color:#e203a9 ؛ اليسار: 40px ؛}
#newyearkw .c3 {color:#b60175 ؛ اليسار: 60px ؛}
#newyearkw .c4 {color:#b60175 ؛ اليسار: 80px ؛}
#newyearkw .c5 {color:#f460af ؛ اليسار: 100px ؛}
#newyearkw .c6 {color:#f460af ؛ اليسار: 120px ؛}
#newyearkw .c7 {color:#fd98a5 ؛ اليسار: 140px ؛}
#newyearkw .c8 {color:#fec8db ؛ اليسار: 160px ؛}
#newyearkw .c9 {color:#fec8db ؛ اليسار: 180px ؛}
#newyearkw .c11 {color:#fec8db ؛}
#newyearkw .c12 {color:#fec8db ؛}
#newyearkw .c13 {color:#fec8db ؛}
#newyearkw .c14 {color:#fec8db ؛}
.word-box {الموضع: النسبية ؛ العرض: 300px ؛ الارتفاع: 20px ؛}
</style>
<div id = "content">
<div id = "m">
<p id = "lg">
<img src = "// files.vevb.com/file_images/article/201407/mylove_logo.png"/>
</p>
<p id = "nv">
<a href = "http://news.baidu.com/" rel = "external nofollow" name = "tj_news">
أخبار
</a>
<b>
صفحة على الإنترنت
</b>
<a href = "http://tieba.baidu.com/" rel = "external nofollow" name = "tj_tieba">
انشرها
</a>
<a href = "http://zhidao.baidu.com/" rel = "external nofollow" name = "tj_zhidao">
يعرف
</a>
<a href = "http://music.baidu.com/" rel = "nofollow" name = "tj_mp3">
موسيقى
</a>
<a href = "http://image.baidu.com/" rel = "external nofollow" name = "tj_img">
صورة
</a>
<a href = "http://v.baidu.com/" rel = "nofollow" name = "tj_video">
فيديو
</a>
<a href = "http://map.baidu.com/" rel = "nofollow" name = "tj_map">
رسم خريطة
</a>
</p>
<div id = "fm">
<form name = "f" action = "http://www.baidu.com/s" target = "_ Blank">
<span>
<type type = "text" name = "wd" id = "kw" maxLength = "100" Autocomplete = "Off"/>
</span>
<type type = "hidden" name = "rsv_bp" value = "0"/>
<type type = "hidden" name = "ch" value = ""/>
<type type = "hidden" name = "tn" value = "sitehao123"/>
<إدخال type = "Hidden" name = "bar" value = ""/>
<type type = "hidden" name = "rsv_spt" value = "3"/>
<type type = "hidden" name = "ie" value = "utf-8"/>
<span>
<type type = "submit" value = "baidu" id = "su" onmousedown = "this.className = 'bg s_btn s_btn_h'" onMouseout = "this.classname = 'bg s_btn'/>
</span>
<div id = "sd_1386659528033" style = "display: none ؛">
</div>
</form>
<span>
<span id = "mholder">
<div id = "mcon">
<span>
طريقة الإدخال
</span>
</div>
</span>
</span>
</div>
<ul id = "newyeareve"> <li i = "0"> </li> <li i = "1"> </li> </ul>
<div id = "play" style = "display: none ؛"> </viv>
<div id = "newyearkw">
<viv>
<img src = "// files.vevb.com/file_images/article/201407/mylove.gif"/>
<i> عزيزي </i>
<i> الحب </i>
<i> 's </i>
<i> ، </i>
<i> الزواج </i>
<i> أعط </i>
<i> أنا </i>
<i> Bar </i>
<img src = "// files.vevb.com/file_images/article/201407/mylove.gif"/>
</div>
</div>
</div>
</div>
<script type = "text/javaScript"> // <! [CDATA [
var newyeareve = newyeareve || {} ؛
newyeareve.dom = وثيقة ؛
newyeareve.box = newyeareve.dom.getElementById ("newyeareve") ؛
newyeareve.kw = newyeareve.dom.getElementById ("kw") ؛
newyeareve.newyearkw = newyeareve.dom.getElementById ("newyearkw") ؛
//newyeareve.logo=newyeareve.dom.getElementById("lg ") ؛
//newyeareve.playdom=newyeareve.dom.getElementById("lay ") ؛
newyeareve.num = -1 ؛
newyeareve.time = 0 ؛
newyeareve.wordwidth = 300 ؛
newyeareve.wordw = 0 ؛
newyeareve.newday = false ؛
newyeareve.dataarr = [{
الكلمة الرئيسية: "لقد أعطيتني شعورًا خاصًا عندما التقيت لأول مرة في 18 مايو 2012"
} ، {
الكلمة الرئيسية: "كنا معًا في 5 يونيو 2012 ، ومنذ ذلك الحين له هذا اليوم العادي معنى خاص بالنسبة لنا"
} ، {
الكلمة الرئيسية: "المشاجرة الأولى في 20 أغسطس 2012 جعلك حزينًا وآسفًا"
} ، {
الكلمة الرئيسية: "رحلة Shangri-La الأولى في 1 أكتوبر 2012"
} ، {
الكلمة الرئيسية: "لقد صنعنا شجرة عيد الميلاد معًا عشية عيد الميلاد ، 24 ديسمبر 2012"
} ، {
الكلمة الرئيسية: "ما زلت أعطيك الورود في عيد الحب الأول في 14 فبراير 2013"
} ، {
الكلمة الرئيسية: "17 مارس 2013 احتفلت بعيد ميلادك الأول"
} ، {
الكلمة الرئيسية: "أنا أيضًا سعيد جدًا بالاحتفال بيوم الأطفال معًا في 1 يونيو 2013"
} ، {
الكلمة الرئيسية: "شكرًا لك على العام الذي كنت فيه إلى جانبك في الذكرى الأولى في 5 يونيو 2013"
} ، {
الكلمة الرئيسية: "سوف آخذك لتناول طعام مسقط رأسي في 4 أغسطس 2013 ، وأرى أن لديك وقتًا رائعًا"
} ، {
الكلمة الرئيسية: "كنت متوترة بعض الشيء عندما قابلت والديك لأول مرة خلال مهرجان منتصف الخريف في 19 سبتمبر 2013"
} ، {
الكلمة الرئيسية: "31 ديسمبر 2013 آمل أن أرافقك للاحتفال بالعام الجديد في كل مرة من الآن فصاعدًا ..."
}
] ؛
newyeareve.createhtml = function (num) {
var h = '' ؛
var n = 1 ؛
num = num-0 ؛
if (num <n+1) {
التبديل (num) {
الحالة 0:
h = '<li i = "0">' ؛
استراحة؛
الحالة 1:
H = '<li i = "0"> </li> <li i = "1"> </li>' ؛
استراحة؛
}
}آخر{
لـ (var i = 0 ؛ i <num-n ؛ i ++) {
H+= '<li i = "'+i+'">' ؛
}
لـ (var i = num-n ؛ i <num+1 ؛ i ++) {
var c = 'icon-newyear'+(i+n-num) ؛
H+= '<li i = "'+i+'">' ؛
}
}
if (newyeareve.box) {
newyeareve.box.innerhtml = h ؛
}
newyeareve.kw.value = newyeareve.dataarr [num] .Keyword ؛
}
newyeareve.animate = function () {
if (newyeareve.num <11) {
newyeareve.num ++ ؛
newyeareve.createhtml (this.num) ؛
}
newyeareve.time = setTimeout (function () {
if (newyeareve.num <11) {
newyeareve.animate () ؛
} آخر {
newyeareve.kw.value = "" ؛
newyeareve.box.innerhtml = "" ؛
newyeareve.wordanimate () ؛
}
} ، 3000) ؛
}
newyeareve.wordanimate = function () {
if (newyeareve.wordw <newyeareve.wordwidth) {
newyeareve.wordw = newyeareve.wordw+1 ؛
newyeareve.newyearkw.style.width = newyeareve.wordw+"px" ؛
setTimeout (function () {
newyeareve.wordanimate () ؛} ، 16) ؛
}آخر{
newyeareve.replay () ؛
}
}
newyeareve.replay = function (num) {
newyeareve.time = setTimeout (function () {
newyeareve.wordw = 0 ؛
newyeareve.newyearkw.style.width = newyeareve.wordw+"px" ؛
newyeareve.kw.value = "" ؛
newyeareve.num = -1 ؛
newyeareve.box.innerhtml = "" ؛
newyeareve.animate () ؛
} ، 3000) ؛
}
newyeareve.box.onclick = دالة (الحدث) {
var e = event.target || event.srcelement ؛
var i = e.getAttribute ("i") ؛
if (i! == null) {
newyeareve.newyearkw.style.width = "0px" ؛
newyeareve.kw.value = newyeareve.dataarr [i] .Keyword ؛
newyeareve.clicknum = i ؛
newyeareve.createhtml (newyeareve.clicknum) ؛
ClearTimeout (newyeareve.time) ؛
newyeareve.time = setTimeout (function () {
//newyeareve.createhtml(newyeareve.num) ؛
newyeareve.num = newyeareve.num == 11؟ 10: newyeareve.num ؛
newyeareve.animate () ؛
//newyeareve.kw.value= newyeareve.user || "" ؛
} ، 3000)
}
}
newyeareve.animate () ؛
//newyeareve.wordanimate () ؛
//]]> </script>