• اطلاعیه ها

    • Saeed Fard

      برگزاری میتاپ وردپرسی   14/08/96

      بعد از اولین دوره همایش وردپرس در ایران اگر پیگیر اخبار وردپرس بوده باشید، حتما خبر برگزاری چندین میتاپ و جلسه متعدد وردپرسی را شنیده‌اید، یکی از بحث‌های اصلی که محور اصلی این میتاپ‌ها بوده است برگزاری وردکمپ بود که به طور جدی دنبال می‌شود. این میتاپ‌ها و جلسات توسط جمعی از فعلان حوزه وردپرس در کنار وردپرس‌پارسی برگزار می‌شد و مسائل مربوط به این حیطه و از جمله وردکمپ مورد بحث قرار می‌گرفت. این بار با رایزنی‌هایی که با تیم اصلی وردپرس داشتیم در بخش دوم این رویدادها قصد داریم که میتاپ‌ها و جلسات وردپرسی را به صورت آزاد برگزار کنیم تا تمامی علاقه‌مندان و دوست‌داران وردپرس فرصت حضور داشته باشند و با گردهمایی، جامعه کاملتری از دوست داران وردپرس بسازیم و از تجربیات یکدیگر استفاده کنیم.   بدیهی است که این رویدادها با رویکرد مثبت در جهت سود رسانی به جامعه وردپرس و افراد حاضر در آن برگزار می‌شود و برای تمامی علاقه‌مندان به وردپرس است. پس اگر یک کاربر معمولی وردپرس یا یک توسعه دهنده هستید می‌توانید در این رویدادها شرکت کنید. ما در ملاقات‌هایمان از موارد مختلف و کاربردی وردپرس صحبت می‌کنیم و علاقمند به توسعه هر چه بیشتر وردپرس در ایران هستیم. ما وردپرس را دوست داریم. عضویت در این گروه برای همه افرادی که مایل به پیوستن هستند بدون در نظرگرفتن توانایی‌ها، مهارت‌ها، وضعیت مالی و یا معیارهای دیگر باز و رایگان است. فضای میتاپ‌ها و جلسات ما دوستانه و آزادنه و دور از هرگونه تبعیض و رفتارهای زننده است. بر این اساس از تمامی دوستانی که علاقه‌مند به شرکت در میتاپ‌های وردپرس هستند دعوت می‌شود تا از طریق لینک زیر در سایت میتاپ اقدام به ثبت‌نام کنند و منتظر خبرهای برگزاری جلسات در آینده باشند . لینک ثبت نام و عضویت : https://www.meetup.com/Iran-WordPress-Meetup    
Maryam

تغییر محتوای یک div با hover

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

3div دارم.چطور می تونم محتوای یک div رو با رفتن روی آن تغییر بدهم ؟ محتوی متن و عکس هست.کد زیر رو نوشتم ولی با رفتن روی یکی از div ها ، div ای که با رفتن روی آن ظاهر می شود پایین می افند.


$(".div-circle").hover(function(){
root=$(this);
$(this).find('.circle').fadeOut('fast',function(){root.find('.circle-hover').fadeIn('fast');});

},function(){
root=$(this);
$(this).find('.circle-hover').fadeOut('fast',function(){root.find('.circle').fadeIn('fast');});
});

div با آی دی های circle-hover و circle ،div هایی هستند که جابجا می شوند و div-circle والد است.

0

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


لینک به پست

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

4

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


لینک به پست


<div class="span4 div-circle">
<div class="circle"><img src="img/img2.png" alt=""/></div>
<div class="circle-hover">
<a href="#" class="a1"></a>
<a href="#" class="a1"></a>
<a href="#" class="a1"></a>
<a href="#" id="text-over">متن</a>
</div>
<span class="text-circle">متن</span>
</div>


.circle{margin:70px 45px 10px;behavior: url(PIE.htc);position:relative;border-radius:250px;-o-border-radius:250px;-webkit-border-radius:250px;-moz-border-radius:250px;-ms-border-radius:250px;height:220px;width:220px;}
.circle-hover{behavior: url(PIE.htc);position:relative;border-radius:250px;-o-border-radius:250px;-webkit-border-radius:250px;-moz-border-radius:250px;-ms-border-radius:250px;margin:70px 45px 10px;height:220px;width:220px;display:none;background:url(../img/bg-circle-over.png) no-repeat;}
.text-circle{text-align:center;display:inline-block;width:100%;color:#000;font:18px 'BYekan'; }

0

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


لینک به پست

کدوم محتوا رو می خواهید با چی تغییر دهید

این کد را فرضی نوشتم البته با jquery هم می شه منتهی چون بعضی قالب ها باهاش مشکل دارند js نوشتم


<script type="text/javascript">
<!--
function mytext2()
{
document.getElementById('myId').innerHTML="محتوای دوم"
}
function mytext1()
{
document.getElementById('myId').innerHTML="محتوای اول"
}
//-->
</script>
<div id="myId" onmouseover="mytext2()" onmouseout="mytext1()">
محتوای اول
</div>

4

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


لینک به پست

سلام

فکر کنم منظورشون با استفاده از CSS بوده و خاصیت hover باید به این صورت استفاده کنید:


اشتباه:
.circle-hover{}
درست:
.circle:hover{}

CSS :hover Selector

و این مثال ها کمکتون خواهد کرد:

CSS mouseover for links, text, and images :


http://www.scientificpsychic.com/etc/css-mouseover.html

+

پنهان کردن دکمه

3

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


لینک به پست

کدوم محتوا رو می خواهید با چی تغییر دهید

این کد را فرضی نوشتم البته با jquery هم می شه منتهی چون بعضی قالب ها باهاش مشکل دارند js نوشتم


<script type="text/javascript">
<!--
function mytext2()
{
document.getElementById('myId').innerHTML="محتوای دوم"
}
function mytext1()
{
document.getElementById('myId').innerHTML="محتوای اول"
}
//-->
</script>
<div id="myId" onmouseover="mytext2()" onmouseout="mytext1()">
محتوای اول
</div>

محتوای div که over میشه زیاده ،راهی غیر از innerHtml ، میشه کد خودم را اصلاح کنید؟

اشتباه:

.circle-hover{}

درست:

.circle:hover{}

نام کلاس circle-hover هست

0

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


لینک به پست

کدهای جی کوئری توی


$(document).ready(function()
{
//jquery
});

قرار میگیرن .

این مورد رو لحاظ نکردید.

3

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


لینک به پست

ببینید همچین چیزی منظورتون هست؟

http://jsfiddle.net/5x53c/2/

4

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


لینک به پست

برای متن های کوتاه می تونید از کد css هم استفاده کنید


content:"متن ";

برای متن و کدهای طولانی مثل مورد شما هم می شه از آژاکس استفاده کرد و هم کد css

به شکل زیر


<style type="text/css">
#text1,.main:hover #text2 {
display:block;
}
.main #text2,.main:hover #text1 {
display:none;
}
</style>
<div class="main">

<div id="text1">
<p>یک متن حاوی کدهای html</p>
</div>

<div id="text2">
<p>یک متن دیگر حاوی کدهای html</p>
</div>

</div>

4

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


لینک به پست

کدهای جی کوئری توی


$(document).ready(function()
{
//jquery
});

قرار میگیرن .

این مورد رو لحاظ نکردید.

اینجا نگذاشتم . در فایل این دستور رو نوشتم

ببینید همچین چیزی منظورتون هست؟

http://jsfiddle.net/5x53c/2/

محتوا ها داخل مربع هستند.خارج از آن نیستن. یعنی مربع باید تغییر کند.کدی که اینجا

گذاشتم محتوا رو تغییر میده ولی وقتی پست سر هم روی آنها میرم hover پایین می افته

0

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


لینک به پست

برای متن های کوتاه می تونید از کد css هم استفاده کنید


content:"متن ";

برای متن و کدهای طولانی مثل مورد شما هم می شه از آژاکس استفاده کرد و هم کد css

به شکل زیر


<style type="text/css">
#text1,.main:hover #text2 {
display:block;
}
.main #text2,.main:hover #text1 {
display:none;
}
</style>
<div class="main">

<div id="text1">
<p>یک متن حاوی کدهای html</p>
</div>

<div id="text2">
<p>یک متن دیگر حاوی کدهای html</p>
</div>

</div>

چیزی شبیه اینه. ولی سه تا رو که در یک ردیف می ذارم ، وقتی ماوس رو روی آنها میبرم دیوی که با hover ظاهر میشه می افته پایین

0

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


لینک به پست

بجای div از المان span استفاده کنید دیگه پایین نمیوفته چون div جزء بلاک هاست ولی span المان برخط هست.

4

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


لینک به پست

ارسال شده در (ویرایش شده)

این هم جواب نداد. ممنون از دوستان. از یک js دیگر استفاده کردم.

ویرایش شده در توسط Maryam
0

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


لینک به پست
:huh:
0

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


لینک به پست

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

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

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

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


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

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

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


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