PHP中文网-QQ群-扫二维码

QQ群

PHP中文网-关注微信公众号-扫二维码

微信公众号

当前位置:php中文网下载站 >js特效 >html5特效 >HTML+CSS3动画天气图标代码

HTML+CSS3动画天气图标代码

2018-02-01 来源/作者:php中文网 分类:html5特效 «» 下载次数:1
HTML+CSS3动画天气图标代码
这是一款jQuery+CSS3实现的带有动画效果的搜索框代码,创意展开收缩搜索框特效下载。

js代码
<script type="text/javascript">
function searchToggle(obj, evt){
var container = $(obj).closest('.search-wrapper');

if(!container.hasClass('active')){
 container.addClass('active');
 evt.preventDefault();
}
else if(container.hasClass('active') && $(obj).closest('.input-holder').length == 0){
 container.removeClass('active');
 // clear input
 container.find('.search-input').val('');
 // clear and hide result container when we press close
 container.find('.result-container').fadeOut(100, function(){$(this).empty();});
}
}

function submitFn(obj, evt){
value = $(obj).find('.search-input').val().trim();

_html = "Yup yup! Your search text sounds like this: ";
if(!value.length){
_html = "Yup yup! Add some text friend :D";
}
else{
_html += "<b>" + value + "</b>";
}

$(obj).find('.result-container').html('<span>' + _html + '</span>');
$(obj).find('.result-container').fadeIn(100);

evt.preventDefault();
}
</script>


申明:PHP中文网下载站匠心打造中国最大的免费下载站!一切资源免费,所有资源都经过检测,请放心下载!

效果预览本地下载  新手使用求助QQ群: