/ اسلایدر فول Css | اتوماتیک اسلاید | | پاس شدن با بردن موس روی آن |قابل استفاده برای وردپرس و ویبولتین |
وندا هاست
طراحی و راه اندازی وبسایت و انجمن توسط ویکی وی بی ویکی وی بی در قبال معاملات صورت گرفته با هر یک از اعضا و سفارشات طراحی خارج از این اطلاعیه هیچگونه مسئولیتی نمی پذیرد
بک لینک ها
فروش قالب وردپرس فروش فایل مشابه ژاکت وندا هاست
صفحه 1 از 5 123 ... آخرینآخرین
نمایش نتایج: از 1 به 10 از 44

مقاله: اسلایدر فول Css | اتوماتیک اسلاید | | پاس شدن با بردن موس روی آن |قابل استفاده برای وردپرس و ویبولتین |

    1. اسلایدر فول Css | اتوماتیک اسلاید | | پاس شدن با بردن موس روی آن |قابل استفاده برای وردپرس و ویبولتین |

      اسلایدر فول Css | اتوماتیک اسلاید | | پاس شدن با بردن موس روی آن |قابل استفاده برای وردپرس و ویبولتین |

      بسم الله الرحمن الرحیم

      این اسلایدر خیلی سبک و شاهکاره (در یک کلام) مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

      | دمو و فولدر عکس ها و استایل سی اس اس | داخل فایل دانلودی مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

      برای وردپرس این کد هارو داخل تگ های بادی قرار بدید


      کد:
      <div class="container">
              <div id="content-slider">
                  <div class="nivoSlider" style="position: relative; background: url("http://www.wikivb.ir/images/img_1.jpg") no-repeat scroll 0% 0% transparent;" id="slider">
                      <div id="mask">
                      <ul>
                  <li id="first" class="firstanimation">
                  <a href="#">
                      <img style="display: none;" src="http://www.wikivb.ir/images/img_1.jpg" alt="Cougar">
                      </a>
                  <div class="tooltip">
                      <h1>متن دلخواه</h1>
                      </div>
                      </li>
                      <li id="second" class="secondanimation">
                      <a href="#">
                      <img src="http://www.wikivb.ir/images/img_2.jpg" alt="Lions">
                      </a>
                  <div class="tooltip">
                      <h1>متن دلخواه</h1>
                      </div>
                      </li>
                       
                      <li id="third" class="thirdanimation">
                      <a href="#">
                      <img src="http://www.wikivb.ir/images/img_3.jpg" alt="Snowalker">
                      </a>
                      <div class="tooltip">
                      <h1>متن دلخواه</h1>
                      </div>
                      </li>
                                   
                      <li id="fourth" class="fourthanimation">
                      <a href="#">
                      <img src="http://www.wikivb.ir/images/img_4.jpg" alt="Howling">
                      </a>
                      <div class="tooltip">
                      <h1>متن دلخواه</h1>
                      </div>
                      </li>
                                   
                      <li id="fifth" class="fifthanimation">
                      <a href="#">
                      <img src="http://www.wikivb.ir/images/img_5.jpg" alt="Sunbathing">
                      </a>
                      <div class="tooltip">
                      <h1>متن دلخواه</h1>
                      </div>
                      </li>
                      </ul>
                      </div>
                      <div class="progress-bar"></div>
                  <div style="display: none; opacity: 0.8;" class="nivo-caption"><p></p></div><div style="display: none;" class="nivo-directionNav"><a class="nivo-prevNav">Prev</a><a class="nivo-nextNav">Next</a></div><div class="nivo-controlNav"><a class="nivo-control active" rel="0">1</a><a class="nivo-control" rel="1">2</a></div></div>
              </div>
          </div>
      سپس این کد هارو داخل تگ های استایل بگذارید

      کد:
          /* wikivb css3 slider */
          html, body, div, span, applet, object, iframe,
          h1, h2, h3, h4, h5, h6, p, blockquote, pre,
          a, abbr, acronym, address, big, cite, code,
          del, dfn, em, img, ins, kbd, q, s, samp,
      small, strike, strong, sub, sup, tt, var,
      b, u, i, center,
          dl, dt, dd, ol, ul, li,
          fieldset, form, label, legend,
          table, caption, tbody, tfoot, thead, tr, th, td,
          article, aside, canvas, details, embed,
          figure, figcaption, footer, header, hgroup,
          menu, nav, output, ruby, section, summary,
          time, mark, audio, video {
              margin: 0;
              padding: 0;
              border: 0;
          font-size: 100%;
          font: inherit;
          vertical-align: baseline;
      }
      /* LAYOUT */
          .container {
              margin:0 auto;
              overflow:hidden;
              width:960px;
          }
          /* CONTENT SLIDER */
          #content-slider {
              width:100%;
              height:360px;
              margin:10px auto 0;
          }
          /* SLIDER */
          #slider {
          background:#000;
              border:5px solid #eaeaea;
              box-shadow:1px 1px 5px rgba(0,0,0,0.7);
          height:320px;
              width:680px;
          margin:10px auto 0;
          overflow:visible;
          position:relative;
          }
          #mask {
          overflow:hidden;
              height:320px;
          }
          #slider ul {
              margin:0;
              padding:0;
              position:relative;
          }
          #slider li {
              width:680px;
              height:320px;
              position:absolute;
          top:-325px;
              list-style:none;
          }
          #slider li.firstanimation {
              -moz-animation:cycle 25s linear infinite;  
              -webkit-animation:cycle 25s linear infinite;       
          }
          #slider li.secondanimation {
          -moz-animation:cycletwo 25s linear infinite;
              -webkit-animation:cycletwo 25s linear infinite;    
          }
          #slider li.thirdanimation {
              -moz-animation:cyclethree 25s linear infinite;
              -webkit-animation:cyclethree 25s linear infinite;      
          }
          #slider li.fourthanimation {
              -moz-animation:cyclefour 25s linear infinite;
              -webkit-animation:cyclefour 25s linear infinite;       
          }
          #slider li.fifthanimation {
          -moz-animation:cyclefive 25s linear infinite;
              -webkit-animation:cyclefive 25s linear infinite;       
          }
          #slider .tooltip {
              background:rgba(0,0,0,0.7);
              width:300px;
          height:60px;
          position:relative;
              bottom:75px;
              left:690px;
          -moz-transition:all 0.3s ease-in-out;
              -webkit-transition:all 0.3s ease-in-out; 
          }
          #slider .tooltip h1 {
              color:#fff;
          font-size:24px;
              font-weight:300;
          line-height:60px;
          direction:rtl;
          padding:0 20px 0 0;
          }
          #slider li#first:hover .tooltip,
          #slider li#second:hover .tooltip,
          #slider li#third:hover .tooltip,
          #slider li#fourth:hover .tooltip,
          #slider li#fifth:hover .tooltip {
          left:390px;
      }
          #slider:hover li,
          #slider:hover .progress-bar {
          -moz-animation-play-state:paused;
              -webkit-animation-play-state:paused;
          }
      /* PROGRESS BAR */
          .progress-bar {
              position:relative;
          top:-5px;
          width:680px;
          height:5px;
              background:#000;
          -moz-animation:fullexpand 25s ease-out infinite;
        -webkit-animation:fullexpand 25s ease-out infinite;
          }
          /* ANIMATION */
          @-moz-keyframes cycle {
              0%  { top:0px; }
          4%  { top:0px; }
              16% { top:0px; opacity:1; z-index:0; }
          20% { top:325px; opacity:0; z-index:0; }
          21% { top:-325px; opacity:0; z-index:-1; }
              92% { top:-325px; opacity:0; z-index:0; }
              96% { top:-325px; opacity:0; }
              100%{ top:0px; opacity:1; }
               
          }
          @-moz-keyframes cycletwo {
              0%  { top:-325px; opacity:0; }
         16% { top:-325px; opacity:0; }
              20% { top:0px; opacity:1; }
          24% { top:0px; opacity:1; }
          36% { top:0px; opacity:1; z-index:0; }
          40% { top:325px; opacity:0; z-index:0; }
          41% { top:-325px; opacity:0; z-index:-1; }
          100%{ top:-325px; opacity:0; z-index:-1; }
      }
          @-moz-keyframes cyclethree {
          0%  { top:-325px; opacity:0; }
          36% { top:-325px; opacity:0; }
              40% { top:0px; opacity:1; }
              44% { top:0px; opacity:1; }
          56% { top:0px; opacity:1; }
          60% { top:325px; opacity:0; z-index:0; }
              61% { top:-325px; opacity:0; z-index:-1; }
              100%{ top:-325px; opacity:0; z-index:-1; }
      }
          @-moz-keyframes cyclefour {
              0%  { top:-325px; opacity:0; }
              56% { top:-325px; opacity:0; }
         60% { top:0px; opacity:1; }
              64% { top:0px; opacity:1; }
          76% { top:0px; opacity:1; z-index:0; }
          80% { top:325px; opacity:0; z-index:0; }
              81% { top:-325px; opacity:0; z-index:-1; }
              100%{ top:-325px; opacity:0; z-index:-1; }
          }
      @-moz-keyframes cyclefive {
          0%  { top:-325px; opacity:0; }
              76% { top:-325px; opacity:0; }
         80% { top:0px; opacity:1; }
              84% { top:0px; opacity:1; }
          96% { top:0px; opacity:1; z-index:0; }
              100%{ top:325px; opacity:0; z-index:0; }
          }
          @-webkit-keyframes cycle {
          0%  { top:0px; }
          4%  { top:0px; }
        16% { top:0px; opacity:1; z-index:0; }
          20% { top:325px; opacity:0; z-index:0; }
          21% { top:-325px; opacity:0; z-index:-1; }
              50% { top:-325px; opacity:0; z-index:-1; }
              92% { top:-325px; opacity:0; z-index:0; }
          96% { top:-325px; opacity:0; }
          100%{ top:0px; opacity:1; }
               
      }
          @-webkit-keyframes cycletwo {
              0%  { top:-325px; opacity:0; }
          16% { top:-325px; opacity:0; }
          20% { top:0px; opacity:1; }
          24% { top:0px; opacity:1; }
          36% { top:0px; opacity:1; z-index:0; }
          40% { top:325px; opacity:0; z-index:0; }
          41% { top:-325px; opacity:0; z-index:-1; } 
         100%{ top:-325px; opacity:0; z-index:-1; }
          }
          @-webkit-keyframes cyclethree {
          0%  { top:-325px; opacity:0; }
          36% { top:-325px; opacity:0; }
              40% { top:0px; opacity:1; }
              44% { top:0px; opacity:1; }
          56% { top:0px; opacity:1; z-index:0; }
              60% { top:325px; opacity:0; z-index:0; }
              61% { top:-325px; opacity:0; z-index:-1; }
          100%{ top:-325px; opacity:0; z-index:-1; }
      }
      @-webkit-keyframes cyclefour {
          0%  { top:-325px; opacity:0; }
          56% { top:-325px; opacity:0; }
              60% { top:0px; opacity:1; }
          64% { top:0px; opacity:1; }
          76% { top:0px; opacity:1; z-index:0; }
              80% { top:325px; opacity:0; z-index:0; }
              81% { top:-325px; opacity:0; z-index:-1; }
          100%{ top:-325px; opacity:0; z-index:-1; }
          }
          @-webkit-keyframes cyclefive {
          0%  { top:-325px; opacity:0; }
              76% { top:-325px; opacity:0; }
              80% { top:0px; opacity:1; }
          84% { top:0px; opacity:1; }
          96% { top:0px; opacity:1; z-index:0; }
          100%{ top:325px; opacity:0; z-index:0; }
      }
          /* ANIMATION BAR */
          @-moz-keyframes fullexpand {
              0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
              4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
             16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
             17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
             18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }  
          }
          @-webkit-keyframes fullexpand {
              0%, 20%, 40%, 60%, 80%, 100% { width:0%; opacity:0; }
              4%, 24%, 44%, 64%, 84% { width:0%; opacity:0.3; }
         16%, 36%, 56%, 76%, 96% { width:100%; opacity:0.7; }
         17%, 37%, 57%, 77%, 97% { width:100%; opacity:0.3; }
             18%, 38%, 58%, 78%, 98% { width:100%; opacity:0; }  
          }
          /* HTML5 display-role reset for older browsers */
          article, aside, details, figcaption, figure,
          footer, header, hgroup, menu, nav, section {
              display: block;
          }
          body {
          line-height: 1;
          }
          ol, ul {
          list-style: none;
          }
          blockquote, q {
              quotes: none;
          }
          blockquote:before, blockquote:after,
          q:before, q:after {
              content: '';
          content: none;
      }
          table {
          border-collapse: collapse;
              border-spacing: 0;
          }
      برای ویبولتین کد های اول رو به هرجایی که دوست دارید قرار بدید مثلا ناو بار و کد های دوم رو توی ادیشنال
      ولی یادتون نره که ادرس دهی باید عوض شه و فولدر که توی فایل دانلودی هست باید توی فولدر اون استایلی که دارید اسلایدر رو توش میزارید اکسترکت شه

      سایز عکس ها هم باید 320*680 باشه .
      و در ضمن اسم عکس هاهم باید همینی باشه که توی فولدر دانلود هست

      در پناه حق مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
      اسلایدر فول Css | اتوماتیک اسلاید | | پاس شدن با بردن موس روی آن |قابل استفاده برای وردپرس و ویبولتین | فايل هاي پيوست شده
      ویرایش توسط xperiairan : 05-01-2014 در ساعت 11:46 PM
      چنانچه این مطلب مورد پسند شما واقع شده بر روی کلیک کنید .

      12 نفر از اعضا پست xperiairan را پسندیده اند


  1. #2
    Mehrab JT آنلاین نیست.
    Mehrab JT
    کاربر فعال و مفيد
    1,240نوشته1,400مورد پسند

    تاریخ عضویت
    Jun 2013
    شماره عضویت
    1963
    پسندیده است
    2,945 پست
    بلاگ
    4 پست
    میزان امتیاز
    1408
    telegram.me/mehrab_jt
    ببخشید قصد زیر سوال بردنتون رو ندارم ولی 90% شبیه اسلایدر استایل خودمِ که به جزیره سفارش داده بودممرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    درهرصورت خسته نباشیدمرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

    کاربر زیر پست Mehrab JT را پسندیده است:


    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  2. #3
    xperiairan آنلاین نیست.
    xperiairan
    کاربر اخراجي
    532نوشته662مورد پسند

    تاریخ عضویت
    Sep 2013
    شماره عضویت
    3018
    پسندیده است
    327 پست
    بلاگ
    پست
    میزان امتیاز
    672
    wikivb.ir
    نقل قول نوشته اصلی توسط PerSiaN FrieNds نمایش پست ها
    ببخشید قصد زیر سوال بردنتون رو ندارم ولی 90% شبیه اسلایدر استایل خودمِ که به جزیره سفارش داده بودممرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    درهرصورت خسته نباشیدمرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    درود. بدون دیدن نظرندید عزیز + این اسلایدر برای بنده توسط گروه جی دیزاین طراحی شده بود که الان پاپ کردم مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

    کاربر زیر پست xperiairan را پسندیده است:



  3. #4
    Mehrab JT آنلاین نیست.
    Mehrab JT
    کاربر فعال و مفيد
    1,240نوشته1,400مورد پسند

    تاریخ عضویت
    Jun 2013
    شماره عضویت
    1963
    پسندیده است
    2,945 پست
    بلاگ
    4 پست
    میزان امتیاز
    1408
    telegram.me/mehrab_jt
    نقل قول نوشته اصلی توسط xperiairan نمایش پست ها
    درود. بدون دیدن نظرندید عزیز + این اسلایدر برای بنده توسط گروه جی دیزاین طراحی شده بود که الان پاپ کردم مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    عزیزدل دان کردم دیدن هم دیدم تصاویر اسلایدر هم دقیقا همون تصاویرِ بدون یک تصویر متفاوت
    حتی alt تصاویرهم تغییر نکرده دوست عزیز

    alt="Cougar"
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  4. #5
    xperiairan آنلاین نیست.
    xperiairan
    کاربر اخراجي
    532نوشته662مورد پسند

    تاریخ عضویت
    Sep 2013
    شماره عضویت
    3018
    پسندیده است
    327 پست
    بلاگ
    پست
    میزان امتیاز
    672
    wikivb.ir
    نقل قول نوشته اصلی توسط PerSiaN FrieNds نمایش پست ها
    عزیزدل دان کردم دیدن هم دیدم تصاویر اسلایدر هم دقیقا همون تصاویرِ بدون یک تصویر متفاوت
    حتی alt تصاویرهم تغییر نکرده دوست عزیز

    alt="Cougar"
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی کاملا معلوم هست که دانلود کردید مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی در ضمن عزیز کوگر یعنی گربه وحشی پشمالو که یعنی شیر مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی + اگر ممکن هست اسلایرتون رو بدید ببینم مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  5. #6
    Mehrab JT آنلاین نیست.
    Mehrab JT
    کاربر فعال و مفيد
    1,240نوشته1,400مورد پسند

    تاریخ عضویت
    Jun 2013
    شماره عضویت
    1963
    پسندیده است
    2,945 پست
    بلاگ
    4 پست
    میزان امتیاز
    1408
    telegram.me/mehrab_jt
    نقل قول نوشته اصلی توسط xperiairan نمایش پست ها
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی کاملا معلوم هست که دانلود کردید مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی در ضمن عزیز کوگر یعنی گربه وحشی پشمالو که یعنی شیر مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی + اگر ممکن هست اسلایرتون رو بدید ببینم مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    بنده این اسلایدر رو دان کردم
    مورد دوم جهت اینکه مطمعن بشید از طریق پ خ با cssnevis فرشاد در ارتباط باشید
    درضمن بنده منظورم این بود تصاویر عینا همون تصاویرند نه اینکه لغت ترجمه کنیدمرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی چطور ممکنه که دو گروه عینا اسلایدر بزنن؟مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  6. #7
    xperiairan آنلاین نیست.
    xperiairan
    کاربر اخراجي
    532نوشته662مورد پسند

    تاریخ عضویت
    Sep 2013
    شماره عضویت
    3018
    پسندیده است
    327 پست
    بلاگ
    پست
    میزان امتیاز
    672
    wikivb.ir
    نقل قول نوشته اصلی توسط PerSiaN FrieNds نمایش پست ها
    بنده این اسلایدر رو دان کردم
    مورد دوم جهت اینکه مطمعن بشید از طریق پ خ با cssnevis فرشاد در ارتباط باشید
    درضمن بنده منظورم این بود تصاویر عینا همون تصاویرند نه اینکه لغت ترجمه کنیدمرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی چطور ممکنه که دو گروه عینا اسلایدر بزنن؟مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    عزیز این اصل اسلایدر هست http://jdesign.ir/download-cod/slide...s3-slider.html که من مقداری خاصیت های بهتر و افکت های حرکتی بهتر بش دادم اون عزیز هم که میفر مایید احتمالا از اینجا برداشتن این مطلب مال 5 شهریور 91 هست مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  7. #8
    Mehrab JT آنلاین نیست.
    Mehrab JT
    کاربر فعال و مفيد
    1,240نوشته1,400مورد پسند

    تاریخ عضویت
    Jun 2013
    شماره عضویت
    1963
    پسندیده است
    2,945 پست
    بلاگ
    4 پست
    میزان امتیاز
    1408
    telegram.me/mehrab_jt
    نقل قول نوشته اصلی توسط xperiairan نمایش پست ها
    عزیز این اصل اسلایدر هست http://jdesign.ir/download-cod/slide...s3-slider.html که من مقداری خاصیت های بهتر و افکت های حرکتی بهتر بش دادم اون عزیز هم که میفر مایید احتمالا از اینجا برداشتن این مطلب مال 5 شهریور 91 هست مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    :-? بازم من هماهنگ میکنم ببینم این موضوع صحت داره یا خیر مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی
    چون این استایل با دمو آنلاین قبلا برای فروش در دو مرجع قرار داده شده بود
    انشاالله حق با شما باشه
    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  8. #9
    Mehrab JT آنلاین نیست.
    Mehrab JT
    کاربر فعال و مفيد
    1,240نوشته1,400مورد پسند

    تاریخ عضویت
    Jun 2013
    شماره عضویت
    1963
    پسندیده است
    2,945 پست
    بلاگ
    4 پست
    میزان امتیاز
    1408
    telegram.me/mehrab_jt
    ببخشید من از ایشون عذر میخام به خاطر قضاوت عجولانم
    مثل اینکه مشکل چیز دیگه ای بودهمرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی و از کدهای اماده برای اسلایدر استایل بنده استفاده شده

    کاربر زیر پست Mehrab JT را پسندیده است:


    مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی

  9. #10
    TaktArinA آنلاین نیست.
    TaktArinA
    کاربر سايت
    885نوشته192مورد پسند

    تاریخ عضویت
    Jul 2013
    شماره عضویت
    2414
    پسندیده است
    1,123 پست
    بلاگ
    پست
    میزان امتیاز
    202
    www.forum.mihanvij.ir
    ممنون از شما
    دو تا سوال داشتم :

    1- برای وردپرس ، فایل پیوست رو هم باید دانلود کرد؟ اگر باید دانلود کرد، باید کجا آپلود کنیم؟
    2- منظور از تگ های بادی و تگ های استایل ، دقیقا کدوم فایل ها هستن؟ این تگ ها کجا قرار دارند؟ من تازه وردپرس نصب کردم

صفحه 1 از 5 123 ... آخرینآخرین

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کلمات کلیدی این موضوع

مرجع تخصصی و رایگان ویبولتین در ایران | ویکی وی بی مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •  
خرید بک لینک