سعید شعبانی

ساخت دکمه جستجو توسط css و html

10 پست در این موضوع قرار دارد

دوستان سلام

من می خواهم با استفاده از css و html یک دکمه برای بخش جستجو درست کنم.

طریقه عملکرد دکمه به اینصورت باشه که در ابتدا کلمه جستجو دیده شود و با کلیک کردن روی دکمه جستجو فرم جستجو باز شود و بتوان با آن کار کرد و با کلیک دوباره روی کلمه جستجو یا جایی خارج از فرم جستجو, فرم جستجو محو و کلمه جستجو نشان داده شود.

تاحدی پیش رفتم ولی درست کار نمی کند. لطفا راهنمایی کنید

http://jsbin.com/ajacor/1

1

به اشتراک گذاری این پست


لینک به پست

سلام

اینو دانلود کن 3 نمونه خیلی خوشگل داره همینی که میخوای هست ببین به کارت میاد یا نه :

Demo.zip

9

به اشتراک گذاری این پست


لینک به پست

سلام

اینو دانلود کن 3 نمونه خیلی خوشگل داره همینی که میخوای هست ببین به کارت میاد یا نه :

Demo.zip

میشه یک نمونه را بدید که از جی کئوری استفاه نکرده باشه

0

به اشتراک گذاری این پست


لینک به پست

کد جاوا این را میشه داخل یک فایل که از قبل برای تب ها هست گذاشت؟

0

به اشتراک گذاری این پست


لینک به پست

کد جاوا این را میشه داخل یک فایل که از قبل برای تب ها هست گذاشت؟

بله مشکلی ندارد

1

به اشتراک گذاری این پست


لینک به پست

این یه نمونه است که یه طرفه ولی بدون جی کوئری


http://jsbin.com/exirog/1

5

به اشتراک گذاری این پست


لینک به پست

این یه نمونه است که یه طرفه ولی بدون جی کوئری


http://jsbin.com/exirog/1

iهمین کد برای هر دو حالت باز و بسته (بدون js)

http://jsbin.com/exirog/3/

کد جاوا این را میشه داخل یک فایل که از قبل برای تب ها هست گذاشت؟

کد را در هر فایل js بگذارید فرقی ندارد و به کد فراخوانیش دقت کنید


showhidden('searchform')

به جای searchform می توانید id باکس های دیگر را بگذارید و در واقع با همین کد هر تعداد که خواستید جعبه مخفی شونده (یا هر اسمی که بشه روش گذاشت) بسازید، همینطور منوهای درختی

6

به اشتراک گذاری این پست


لینک به پست

سلام

دوستان من یه همچین فرمی برای search دارم


<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control serarch-btn" placeholder="جستجو کنید ..." name="search">
</div>
<button type="submit" class="serarch-su" name="search-su" value=""></button>
</form>

که خروجیش این میشه

ioi2_dfsdgsdfg.png

در حالت عادی فیلد متن جستجو پنهان هست

میخوام وقتی روی input سرچ کلیک شد فیلد متن جستجو نمایش داده بشه

و وقتی هم که برای بار دوم کلیک شد جستجو انجام بشه

پیشاپیش ممنون از کمکتون

0

به اشتراک گذاری این پست


لینک به پست

UP

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری

  • مطالب مشابه

    • توسط m3hrdaad
      با سلام.
      من تو وب سایتم یک فیلدی دارم برای جستجو پیشرفته محصولات استفاده میشه و به صورت آجاکسی هست (بخشی از نام محصول یادداشت میشه و محصولات لیست میشن). این فیلد دقیقا بالای منوی اصلی سایت هست و کاملا هم به درستی کار میکنه.
      مشکل من سر رنگ بندی نتایجی هست که بعد از تایپ بخشی از نام محصولات میاد. مثلا مطابق این عکس، من وقتی یک کلمه ای رو مینویسم، لیست محصولات مشخص میشه ولی هنوز منوی اصلی من مشخص هست. در حالیکه من میخوام منو زیر این لیست قرار بگیره. چون اینجوری تداخل در نوشته ها وجود داره.
      کسی میتونه کمکی کنه؟
      ممنون میشم از همه دوستان


    • توسط unid_user
      سلام و درود
      دوستان گرامی ، من یه فایل search.php ساختم و با دستور شرطی زیر گفتم اگه پست تایپ product بود نتایج رو نشون بده.
      <div class="woocommerce woocommerce-box"> <ul class="products"> <?php if ( post_type_exists( 'product' ) ) : while ( have_posts() ) : the_post(); ?> <li class="product"> <a class="woocommerce-LoopProduct-link woocommerce-loop-product__link" href="<?php the_permalink(); ?>"> <?php woocommerce_template_loop_product_thumbnail() ?> <h2 class="woocommerce-loop-product__title"><?php the_title(); ?></h2> <span class="price"> <?php woocommerce_template_loop_price() ?> </span> <?php woocommerce_template_loop_add_to_cart(); ?> </a> </li> <?php endwhile; ?> <?php else: ?> <?php endif; ?> </ul> </div> اما وقتی می خوام اسم یک مقاله رو توی قسمت جستجوی سایت وارد کنم. در صفحه نمایش جستجوها که کدهای بالا توش نوشته شده یک خطا میده. هرچند که اون مقاله هم نشون داده میشه.
      Fatal error: Call to a member function get_price_html() on null in /home2/tinymedi/public_html/wp-content/plugins/woocommerce/templates/loop/price.php on line 26 اولا راهی برای حل این مشکل وجود داره؟
      دوم اینکه میشه مثلا search-product.php ساخت و نتایج جستجو رو از search.php جدا نمایش بده؟
      با تشکر و سپاس
    • توسط maraljoon
      سلام دوستان.. وقت بخیر
      افزونه ای هست که بشه تو نقشه جستجو کرد؟؟ واضح تر اینکه فرض کنید یه سایت مثل سایت املاک بخشی داشته باشه که بشه مثلا تو شهر تهران مناطقی که مورد های اجاره ای یا فروش وجود داره رو پیدا کرد. یعنی وقتی مدیر سایت یا کاربران که آگهی اجاره یا فروش ثبت میکنند رونقشه علامت گذاری بشه و بازدید کننده ها بتونن تو نقشه رو اون علامت گذاری ها برن و از اون طریق به لینک اون صفحه( لینک اون آگهی) تو سایت برن.
      مثل نمونه ای که تو این سایت هست: www.manishen.com/fa-searchMap-خرید و فروش-تهران
      اگه افزونه یا راهی سراغ دارید ممنون میشم معرفی کنید.
    • توسط cloudgamer
      سلام خدمت تمام اعضای انجمن وردپرس فارسی و تشکر از پیگیری های شما.
      میخواستم بدونم کد برای فراخوانی جستجو در سایت چیه؟
      کد میخوام جستجو رو داخل سایت بیاره و سالم باشه
      ممنون میشم کمک کنید.
    • توسط unid_user
      با سلام و درود
      دوستان من میخوام که دکمه مربوط به درج قیمت رو داینامیک کنم اما نمیدونم باید به چه روشی این کار رو انجام بدم. لطفا به تصویر نگاه کنید.
      برای این بخش که پیشنهاد ویژه سایتم هست یه پست تایپ نوشتم. توی اون عنوان که همون عنوان مقاله میشه. قسمت متن هم که باز متنی هست که توی ویرایشگر مینویسم. تصویر هم که تصویر شاخص هست و بجای کلیک ادامه مطلب یا بیشتر بخوانید نوشتم خرید. حالا نمیدونم اون کلید قیمت رو چطور باید بنویسم. قرار نیست که این کلید قیمت قابل کلیک باشه.
      لطفا راهنمایی کنید. ممنون.