• اطلاعیه ها

    • Saeed Fard

      حمایت وردپرس پارسی از همایش آینده وب و موبایل   19/04/74

        چهارم و پنجم اسفند ماه 1395، همایش آیندهٔ وب و موبایل ایران با حمایت سازمان فناوری اطلاعات در مرکز همایش‌های شهید قندی برگزار خواهد شد. این همایش یک رویداد ۲ روزه است که در آن پیشتازان صنعت وب و موبایل از تکنولوژی‌های روز دنیا در این حوزه‌ها سخن می‌گویند به طوری که این همایش پنجره‌ای به چشم‌انداز آینده‌ٔ وب و موبایل در جهان، و همچنین راهنمایی برای تصمیم‌گیران، تصمیم‌سازان و متخصصان ایرانی است.   فرصت‌هایی که FOWM#  برای شما خلق خواهد کرد: آشنایی با تکنولوژی‌های آینده‌ساز وب و موبایل شرکت در مباحث چالشی درباره وب و موبایل ارتباط و شبکه‌سازی با “قله‌های وب و موبایل” موقعیت‌های کاری، هم‌تیمی‌های جدید دریافت گواهی شرکت در همایش دو روز به‌یادماندنی سرشار از شگفتی   شرکت‌کنندگان در این همایش ضمن آشنایی با فناوری‌های آینده‌ساز وب و موبایل، شرکت در مباحث چالشی و ارتباط با بزرگان وب و موبایل ایران، می‌توانند موقعیت‌های کاری و هم‌تیمی‌های جدید برای کسب‌وکار خود بیابند. این همایش برای طراحان و توسعه‌دهندگان وب‌سایت و موبایل، مدیران ارشد سازمان‌ها، صاحبان کسب‌وکارهای کوچک و متوسط، دانشجویان و علاقه‌مندان دارای نکات آموزشی و جذاب خواهد بود.   مجید علوی‌زاده، دبیر همایش آیندهٔ وب و موبایل که سابقه اجرای چند همایش و سمینار مرتبط را دارد، اعلام کرد: جمعی از بهترین‌ها و پیشروان این دو حوزه در ایران با ارائه‌های تخصصی خود، چشم‌انداز آینده این صنعت‌ها را به شرکت‌کنندگان عرضه خواهند کرد.   در هر یک از روزهای برگزاری همایش، یک پنل تخصصی در مورد یکی از موضوع‌های مهم این حوزه نیز برگزار خواهد شد و دست‌اندرکاران به بحث و تبادل نظر خواهند پرداخت و در پایان، به شرکت‌کنندگان گواهی حضور در همایش اعطا خواهد شد.   ثبت نام در مهمترین رویداد صنعت وب و موبایل ایران تا پایان بهمن ماه ۹۵ امکان پذیر خواهد بود، برای ثبت نام و یا کسب اطلاعات بیشتر در خصوص این رویداد و آشنایی با موضوعات و سخنرانان به آدرس http://conf.wsschool.org/fowm مراجعه نمایید.   کاربران وردپرس پارسی می‌توانند با استفاده از کد wp-parsi از مبلغ ۴۰ هزار تومان تخفیف در ثبت نام برخوردار شوند.

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

سلام دوستان ...

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

مثل سایت زیر اگه ببینید متنهای هر عکس موقع نمایش یه افکت دارن ...

لینک سایت

ممنون میشم راهنمایی کنید ...

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


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

دوستان اگه میشه بگید چه جوری میتونم روی هر عکس متن بزارم + افکت به متن

اسلایدر هم روی سایت هستش که ادرسش هم تو امضا هست

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


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

سایت ..یلتره

افزونه های اسلایدر زیاد هستند که افکتها مختلفی دارند

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


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

سایت ..یلتر نیست !!! ...

اگه شما راهنمایی کنید که من خودم یه متن روی هر عکس بیارم و به هر کدوم یه افکت ساده بدم ، خیلی عالی میشه ...

لطفا راهنمایی کنید

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


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

شما در کنار هر عکس یک المان مثلا span قرار بدید

بعد بهش خاصیت position:absolute بدید. بعد به عکس position:related بدید.

حالا به المان مقدار z-index بیشتر بدید و ارتفاع و پهنای برابر عکس رو بدید.

با اینکار بصورت لایه میاد روی عکس

موفق باشید

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


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

سلام اقا مرتضی

من چیزی رو که گفتید تست کردم ولی نشد ...!!!

اگه میشه بیشتر راهنمایی کنید ...

الان این کدهای اسلایدر تو فایل header.php هستش

<div class="sl">

<div class="slider">

<section>

<div id="viewport-shadow">

<div id="viewport">

<div id="box">

<figure class="slide"><a target="_blank" href="<?php bloginfo('url'); ?>/دانلود-سریال-پایتخت-2-قسمت-4/">

<img src="<?php bloginfo('template_url'); ?>/pic/22.jpg" alt="22" /></a></figure>

<figure class="slide"><a target="_blank" href="<?php bloginfo('url'); ?>/دانلود-سریال-پایتخت-2-قسمت-4/">

<img src="<?php bloginfo('template_url'); ?>/pic/21.jpg" alt="21" /></a></figure>

<figure class="slide"><a target="_blank" href="<?php bloginfo('url'); ?>/دانلود-سریال-همه-خانواده-من-قسمت-4/">

<img src="<?php bloginfo('template_url'); ?>/pic/20.jpg" alt="20" /></a></figure>

<figure class="slide"><a target="_blank" href="<?php bloginfo('url'); ?>/دانلود-فیلم-روزهای-زندگی/">

<img src="<?php bloginfo('template_url'); ?>/pic/18.jpg" alt="18" /></a></figure>

<figure class="slide"><a target="_blank" href="<?php bloginfo('url'); ?>/دانلود-فیلم-راه-ابی-ابریشم/">

<img src="<?php bloginfo('template_url'); ?>/pic/17.jpg" alt="Villaye Man" /></a></figure>

</div>

</div>

<div id="time-indicator"></div>

</div>

<footer>

<nav class="slider-controls">

<ul id="controls">

<li><a class="goto-slide current" href="#" data-slideindex="0"></a></li>

<li><a class="goto-slide" href="#" data-slideindex="1"></a></li>

<li><a class="goto-slide" href="#" data-slideindex="2"></a></li>

<li><a class="goto-slide" href="#" data-slideindex="3"></a></li>

<li><a class="goto-slide" href="#" data-slideindex="4"></a></li>

</ul>

</nav>

</footer>

</section>

</div>

<script src="<?php bloginfo('template_url'); ?>/js/box-slider-all.jquery.min.js"></script>

<script src="<?php bloginfo('template_url'); ?>/js/box-slider-fx-tile-3d.js"></script>

<script>

$(function () {

var $box = $('#box')

, $indicators = $('.goto-slide')

, $effects = $('.effect')

, $timeIndicator = $('#time-indicator')

, slideInterval = 5000;

var switchIndicator = function ($c, $n, currIndex, nextIndex) {

$timeIndicator.stop().css('width', 0);

$indicators.removeClass('current').eq(nextIndex).addClass('current');

};

var startTimeIndicator = function () {

$timeIndicator.animate({width: '968px'}, slideInterval);

};

// initialize the plugin with the desired settings

$box.boxSlider({

speed: 500

, autoScroll: true

, timeout: slideInterval

, next: '#next'

, prev: '#prev'

, pause: '#pause'

, effect: 'scrollHorz'

, blindCount: 15

, onbefore: switchIndicator

, onafter: startTimeIndicator

});

startTimeIndicator();

// pagination isn't built in simply because it's easy to

// roll your own with the plugin API methods

$('#controls').on('click', '.goto-slide', function (ev) {

$box.boxSlider('showSlide', $(this).data('slideindex'));

ev.preventDefault();

});

$('#effect-list').on('click', '.effect', function (ev) {

var $effect = $(this);

$box.boxSlider('option', 'effect', $effect.data('fx'));

$effects.removeClass('current');

$effect.addClass('current');

switchIndicator(null, null, 0, 0);

ev.preventDefault();

});

});

</script>

</div>

و این هم فایل cssش هستش

/* line 22, sass/screen.scss */

#viewport-shadow {

position: relative;

width: 968px;

padding: 0px 0px 0px 0px;

}

/* line 29, sass/screen.scss */

#viewport, #box, .slide {

width: 968px;

height: 350px;

position: relative;

}

/* line 34, sass/screen.scss */

#viewport {

overflow: hidden;

}

/* line 35, sass/screen.scss */

footer {

margin: 0 0px;

}

/* line 37, sass/screen.scss */

#controls {

border-radius: 5px;

padding: 3px 3px 3px 1px;

position: relative;

top: -20px;

right: 5px;

float: right;

overflow: hidden;

-webkit-transition : all 0.2s ease-in-out;

-moz-transition : all 0.2s ease-in-out;

-o-transition : all 0.2s ease-in-out;

}

#controls:hover { background-color: #fff; }

/* line 44, sass/screen.scss */

#controls li {

display: inline;

}

/* line 48, sass/screen.scss */

.goto-slide {

margin-left: 2px;

width: 10px;

height: 10px;

display: block;

float: left;

background-color: #878787;

border-radius: 0px;

-webkit-transition : all 0.5s ease-in-out;

-moz-transition : all 0.5s ease-in-out;

-o-transition : all 0.5s ease-in-out;

}

/* line 62, sass/screen.scss */

.goto-slide.current {

background-color: #0d609b;

}

/* line 123, sass/screen.scss */

#time-indicator {

width: 0px;

height: 3px;

background-color: #0f4c7b;

position: absolute;

left: 0px;

}

حالا چه کار باید بکنم من که روی هر عکس یه متن بیاد و بشه به اون متن موقع نمایش یه افکت بسیار ساده داشته باشه ؟

ویرایش شده در توسط NESTED
long box

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


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

چیزی که نوشتید رو قرار بدید تا مشکل رو بهتون بگیم

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


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

سلام اقا مرتضی

طبق دستور شما رفتم و خلاصه اسلایدر رو با متن درست کردم .

الان میخوام به متنها وقتی میخوان روی هر عکس بیان یه افکت ساده بدم ؟

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


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

چه افکتی ؟ متحرک یا کمرنگ شدن یا...؟

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


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

متحرک شه ...

فقط موقع ورود به عکس یه افکت داشته باشه ...

ممنون

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


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

دوستان ; راهنمایی لطفاَ :mellow:

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


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

بیشتر توضیح بدید؟ چه نوع متحرکی؟

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


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

الان اگه رو اسلایدر سایت نگاه کنید متن همراه عکس میاد ، من میخوام وقتی افکت عکس تموم شد بعدش متنها با یک افکتی ظاهر شه ...

ممنون

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


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

باید بهش افکتی مثلا fadeIn جی کوئری بدید.

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


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

اگه میشه بیشتر توضیح بدید .. ممنون

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


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

دوستان من تو گوگل زیاد سرچ کردم منتهی نتونستم کاری بکنم . اگه میشه بیشتر راهنمایی کنید .

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


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

توضیح اولیه:

http://www.w3schools.com/jquery/eff_fadein.asp

مثال:

http://www.mkyong.com/jquery/jquery-fadein-fadeout-and-fadeto-example/

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


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

ممنون اقا مرتضی ، فقط یه سوال ؟

الات توی این کدهای که شما دادی همه رو باید رو دکمه کلیک کنیم تا حرکت انجام شه ولی من میخوام خودش اتومات حرکت رو انجام بده ، باید چه کار کنم ..

توی کد زیر چه چیزی باید جای click بزنم ؟


<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").fadeIn();
});
});
</script>

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


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

یعنی با حرکت اسلایدر این افکت هم اجرا بشه؟

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


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

یعنی با حرکت اسلایدر این افکت هم اجرا بشه؟

بله

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


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

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

ببینید چی هست و داخل بخش حلقه اون قرار بدید

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


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

سلام

یک کدی که توی فایل header.php کنار کدهای اسلایدر هستش اینه ، منظورتون همین کد هستش یا نه ؟


<script>
$(function () {
var $box = $('#box')
, $indicators = $('.goto-slide')
, $effects = $('.effect')
, $timeIndicator = $('#time-indicator')
, slideInterval = 5000;
var switchIndicator = function ($c, $n, currIndex, nextIndex) {
$timeIndicator.stop().css('width', 0);
$indicators.removeClass('current').eq(nextIndex).addClass('current');
};
var startTimeIndicator = function () {
$timeIndicator.animate({width: '968px'}, slideInterval);
};
// initialize the plugin with the desired settings
$box.boxSlider({
speed: 500
, autoScroll: true
, timeout: slideInterval
, next: '#next'
, prev: '#prev'
, pause: '#pause'
, effect: 'scrollHorz'
, blindCount: 15
, onbefore: switchIndicator
, onafter: startTimeIndicator
});
startTimeIndicator();
// pagination isn't built in simply because it's easy to
// roll your own with the plugin API methods
$('#controls').on('click', '.goto-slide', function (ev) {
$box.boxSlider('showSlide', $(this).data('slideindex'));
ev.preventDefault();
});
$('#effect-list').on('click', '.effect', function (ev) {
var $effect = $(this);
$box.boxSlider('option', 'effect', $effect.data('fx'));
$effects.removeClass('current');
$effect.addClass('current');
switchIndicator(null, null, 0, 0);
ev.preventDefault();
});
});
</script>

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


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

باید از callback استفاده کنید:

http://bxslider.com/options

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


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

سلام

اگه میشه بگید که این نمونه کدهای که راهنمایی کردید یعنی چی و کجا باید به کار ببرم ؟

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


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

دوستان اگه میشه درباره نمونه کدهای که اقا مرتضی معرفی کرده یه راهنمایی کنید که چه جوری باید جاشون داد ...

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


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

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

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

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

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


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

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

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


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