{
"homeurl": "https://supportwebs.ir/blog/",
"resultstype": "vertical",
"resultsposition": "hover",
"itemscount": 4,
"imagewidth": 70,
"imageheight": 70,
"resultitemheight": "auto",
"showauthor": 0,
"showdate": 0,
"showdescription": 1,
"charcount": 2,
"noresultstext": "عبارت جستجو شده پیدا نشد",
"didyoumeantext": "منظور شما این هست : ",
"defaultImage": "https://supportwebs.ir/blog/wp-content/plugins/ajax-search-pro/img/default.jpg",
"highlight": 0,
"highlightwholewords": 1,
"openToBlank": 1,
"scrollToResults": 0,
"resultareaclickable": 1,
"autocomplete": {
"enabled": 1,
"googleOnly": 1,
"lang": "en",
"mobile": 1 },
"triggerontype": 1,
"triggeronclick": 1,
"triggeronreturn": 1,
"triggerOnFacetChange": 1,
"trigger": {
"delay": 300,
"autocomplete_delay": 310 },
"overridewpdefault": 0,
"override_method": "post",
"redirectonclick": 1,
"redirectClickTo": "results_page",
"redirect_on_enter": 1,
"redirectEnterTo": "results_page",
"redirect_url": "?s={phrase}",
"settingsimagepos": "right",
"settingsVisible": 0,
"hresulthidedesc": "0",
"prescontainerheight": "400px",
"pshowsubtitle": "0",
"pshowdesc": "1",
"closeOnDocClick": 1,
"iifNoImage": "description",
"iiRows": 2,
"iiGutter": 5,
"iitemsWidth": 200,
"iitemsHeight": 200,
"iishowOverlay": 1,
"iiblurOverlay": 1,
"iihideContent": 1,
"loaderLocation": "auto",
"analytics": 0,
"analyticsString": "",
"show_more": {
"url": "?s={phrase}",
"action": "ajax"
},
"mobile": {
"trigger_on_type": 1,
"trigger_on_click": 1,
"hide_keyboard": 0 },
"compact": {
"enabled": 0,
"width": "100%",
"closeOnMagnifier": 1,
"closeOnDocument": 0,
"position": "static",
"overlay": 0 },
"animations": {
"pc": {
"settings": {
"anim" : "fadedrop",
"dur" : 300 },
"results" : {
"anim" : "fadedrop",
"dur" : 300 },
"items" : "fadeInDown"
},
"mob": {
"settings": {
"anim" : "fadedrop",
"dur" : 300 },
"results" : {
"anim" : "fadedrop",
"dur" : 300 },
"items" : "voidanim"
}
},
"autop": {
"state": "disabled",
"phrase": "",
"count": 10 }
}
23 نمونه کد Progress Bar طراحی شده با Bootstrap
نمونه کد Progress Bar | نوار پیشرفت یا Progress Bar یک المنت کاربردی و جذاب در طراحی سایت است که برای نمایش میزان پیشرفت در انجام یک پروژه، عملیات یا فرایند مورد استفاده قرار می گیرد. Progress Bar در بوت استرپ در طراح های جذاب، متنوع و کاملا ریسپانسیو قابل اجرا است. در ادامه این مطلب وبلاگ پشتیبان وب به معرفی 23 نمونه کد Progress Bar طراحی شده با Bootstrap پرداختیم و لینک دانلود این کدها نیز به رایگان در اختیار شما همراهان عزیز هنرکده پشتیبان وب قرار می گیرد.
با css طراحی کنید
درباره کد:
BOOTSTRAP 5 LISTINGS RATINGS
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 5.0.0
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP 4 CIRCLE PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.3.1
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP 4 CIRCLE PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.1.1
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP 4 LINEAR PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.1.1
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP 4 PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.0.0
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP 4 PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.3.1
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
با css جدول سایت طراحی کنید
درباره کد:
BOOTSTRAP CIRCULAR PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: خیر
ورژن بوت‌استرپ: 4.3.1
تعلقات: jquery.js
ساخته شده با: HTML / CSS / JS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.1.1
تعلقات: jquery.js, circle-progress.js
ساخته شده با: HTML / CSS / JS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.0.0
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
CIRCLE PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.1.1
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP ANIMATED CIRCLE PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 4.0.0
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 78
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: خیر
ورژن بوت‌استرپ: 3.3.7
تعلقات: jquery.js
ساخته شده با: HTML / CSS / JS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 73
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
طراحی آیکون با css
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 72
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 71
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 70
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: jquery.js
ساخته شده با: HTML / CSS / JS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 67
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
SBOOTSTRAP PROGRESS BAR STYLE 64
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 42
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR STYLE 31
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.3.7
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
PROGRESS BAR – TILES
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورزن بوت‌استرپ: 3.0.3
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP PROGRESS BAR DIAMOND STYLE
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.0.0
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
درباره کد:
BOOTSTRAP ANIMATED PROGRESS BAR
مرورگر های سازگار: Chrome, Edge, Firefox, Opera, Safari
ریسپانسیو: بله
ورژن بوت‌استرپ: 3.0.0
تعلقات: –
ساخته شده با: HTML / CSS
لینک دانلود: کد و پیش نمایش
- مارس 5, 2022
- دسته‌بندی نشده
- 1088
- 0
(یک رای به این مطلب بدهید !)Loading...
Loading...