tips调整，找回密码首页

@@ -52,12 +52,27 @@
                         <span id="country-code" class="country-code">{{location}}</span>
                         <input value="" id="phoneNum" class="input va phone-num" type="text" name="phoneNum"
                                placeholder="Phone Number" autocomplete="off">
+
+                        <div class="tips hide">
+                            <div class="triangle"></div>
+                            <div class="rectangle"></div>
+                        </div>
+
                     </div>
                 </li>
 
                 <li class="clearfix">
-                    <input id="verifyCode" class="input va captcha" type="text" name="verifyCode" placeholder="图形验证码"
-                           autocomplete="off" maxlength="4">
+
+                    <div class="sms-captcha-wrapper">
+                        <input id="verifyCode" class="input va captcha" type="text" name="verifyCode"
+                               placeholder="图形验证码"
+                               autocomplete="off" maxlength="4">
+
+                        <div class="tips hide">
+                            <div class="triangle"></div>
+                            <div class="rectangle"></div>
+                        </div>
+                    </div>
 
                     <div class="left captcha-component">
                         <img id="captcha-img" class="captcha-img" src="{{captchaUrl}}" alt="">
@@ -69,16 +84,11 @@
                 <li class="clearfix">
                     <input name="refer" id="refer" type="hidden" value="http%3A%2F%2Fwww.yohoblk.com%2F">
                     <div class="center">
-                        <a id="find-btn" class="find-btn disable" >下一步</a>
+                        <a id="find-btn" class="find-btn disable">下一步</a>
                     </div>
                 </li>
             </form>
         </ul>
 
-        <div class="tips hide">
-            <div class="triangle"></div>
-            <div class="rectangle"></div>
-        </div>
-
     {{/ back}}
 </div>

@@ -15,7 +15,6 @@ var $regionCodeText = $('#country-code'),
     $imgCaptchaInput = $('#verifyCode'),
     $regionSelectCtrl = $('#area'),
     $nextBtn = $('#find-btn'),
-    $phone = $('#phone'),
     $form = $('#back-form');
 
 var emailRegx = regx.emailRegx,
@@ -23,23 +22,16 @@ var emailRegx = regx.emailRegx,
 
 var ep = new EventProxy();
 
-var $errTip = $('.tips'),
-    $errMsg = $errTip.find('.rectangle');
-
 function errTip(ele, msg) {
-    var topLeft = ele.offset();
+    var $errTip = ele.next('.tips');
+    var $errMsg = $errTip.find('.rectangle');
 
     $errMsg.text(msg);
-    return $errTip.css({
-        top: topLeft.top + ele.height() - 2,
-        left: topLeft.left,
-        width: ele.width() + 2,
-        height: ele.height
-    }).removeClass('hide');
+    return $errTip.removeClass('hide');
 }
 
-function hideTip() {
-    return $errTip.addClass('hide');
+function hideTip(ele) {
+    return ele.next('.tips').addClass('hide');
 }
 
 require('yoho-jquery-placeholder');
@@ -64,7 +56,7 @@ function validatePhoneNumAsync() {
         if (data.code === 200) {
             return true;
         } else if (data.code === 402) {
-            errTip($phone, '该账号不存在');
+            errTip($phoneNumInput, '该账号不存在');
             return false;
         } else if (data.code === 400) {
             refreshImgCaptcha();
@@ -89,7 +81,7 @@ function validatePhoneNumLocal() {
                 if (val.length === 11 && phoneRegx['+86'].test(val)) {
                     return true;
                 } else {
-                    errTip($phone, '手机号码不正确，请重新输入');
+                    errTip($phoneNumInput, '手机号码不正确，请重新输入');
                     return false;
                 }
             }
@@ -99,12 +91,12 @@ function validatePhoneNumLocal() {
             if (emailRegx.test(val)) {
                 return true;
             } else {
-                errTip($phone, '邮箱格式不正确，请重新输入');
+                errTip($phoneNumInput, '邮箱格式不正确，请重新输入');
                 return false;
             }
         }
     } else {
-        errTip($phone, '请输入帐号');
+        errTip($phoneNumInput, '请输入帐号');
         return false;
     }
 }
@@ -118,7 +110,7 @@ function validatePhoneNum() {
                 if (result) {
                     defer.resolve(true);
                 } else {
-                    errTip($phone, '帐号不存在');
+                    errTip($phoneNumInput, '帐号不存在');
                     defer.reject(false);
                 }
             });
@@ -130,6 +122,7 @@ function validatePhoneNum() {
     }
 
     return validate().then(function() {
+        hideTip($phoneNumInput);
         ep.emit('phone-num', true);
     }).fail(function() {
         ep.emit('phone-num', false);
@@ -229,6 +222,12 @@ exports.init = function() {
 
     $imgCaptchaInput.on('blur', function() {
         validateImgCaptcha();
+    }).on('focus', function() {
+        hideTip($imgCaptchaInput);
+    });
+
+    $phoneNumInput.on('focus', function() {
+        hideTip($phoneNumInput);
     });
 
     $nextBtn.on('click', function() {

@@ -104,6 +104,10 @@
     .center {
         text-align: center;
     }
+
+    .sms-captcha-wrapper {
+        width: $captcha;
+    }
 }
 
 .send-email-page {