تغییر متن

[AmiRoo 18]

درود وستان کد زیر کنار هم قرار گرفتن اما حتی وقتی یه اسپیس میزنم بجای اینکه کنار هم باشن میرن زیر همدیگه میخوام متن و عکس هاشونو عوض کنم ولی کنار هم باشن

 

لینک ها تنها برای اعضای سایت قابل نمایش است.

<div class="our-team">
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Gennadi Razumenko</p>
        <p class="member-post">Lead Electrician</p>
    </div>
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Mladen Vugrinicek</p>
        <p class="member-post">Master Electrician</p>
    </div>
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Terry Snow</p>
        <p class="member-post">Journeyman Electrician</p>
    </div>
</div>

 

[Masih 6,279]

درود.

کنارهم قرار گرفتن عناصر قالب توسط CSS قابل انجام هست. ربطی به PHP و HTML نداره. از CSS پیگیر باشید و اگر مشکلی هست از اونجا باید حلش کنید.

[AmiRoo 18]

در 11 ساعت قبل، Masih گفته است :

درود.

کنارهم قرار گرفتن عناصر قالب توسط CSS قابل انجام هست. ربطی به PHP و HTML نداره. از CSS پیگیر باشید و اگر مشکلی هست از اونجا باید حلش کنید.

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

متاسفانه لوکال هست که نشان بدم اما داره کار میکنه توی یک صفحه دیگه کپی کردم درست بود تا یه تغییری میخوام بدم حتی space میزنم میرن زیر همدیگه

 

[Masih 6,279]

احتمالا کد رو کامل کپی نکردید.

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

برای مثال، یک بخش مجزا داخل قالب هست برای کاروسل به این صورت :

<div class="container">
  <div class="row">
    
    
    <div class="our-team">
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Gennadi Razumenko</p>
        <p class="member-post">Lead Electrician</p>
    </div>
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Mladen Vugrinicek</p>
        <p class="member-post">Master Electrician</p>
    </div>
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Terry Snow</p>
        <p class="member-post">Journeyman Electrician</p>
    </div>
	</div>
    
	</div>
</div>

حالا شما فقط بیایید اون DIV های اصلی رو کپی نکنید، هم توی نوع نمایش تأثیر داره هم روی استایل. چون ممکنه توی CSS کلس ها رو به این صورت نوشته باشند :

.container .row .our-team {
	// *****
}

این دستور استایل زمانی کار میکنه که DIV با کلس our-team داخل DIV با کلس container و row قرار گرفته باشه.

 

 

احتمالا مشکل شما هم همینه. اون قسمت از کدها رو کامل منتقل کنید مشکل حل خواهد شد. شاید هم نیاز به ویرایش برخی دستورات و اضافه کردن چند CSS هم باشه ولی شما با همون کپی کردن کامل شروع کنید بخش بزرگی از مشکل حل میشه.

[AmiRoo 18]

در در 16 دی 1397 در 16:17، Masih گفته است :

احتمالا کد رو کامل کپی نکردید.

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

برای مثال، یک بخش مجزا داخل قالب هست برای کاروسل به این صورت :

<div class="container">
  <div class="row">
    
    
    <div class="our-team">
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Gennadi Razumenko</p>
        <p class="member-post">Lead Electrician</p>
    </div>
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Mladen Vugrinicek</p>
        <p class="member-post">Master Electrician</p>
    </div>
    <div class="team-blocks">
        <img alt="our-team" src="@">
        <p class="member-name">Terry Snow</p>
        <p class="member-post">Journeyman Electrician</p>
    </div>
	</div>
    
	</div>
</div>

حالا شما فقط بیایید اون DIV های اصلی رو کپی نکنید، هم توی نوع نمایش تأثیر داره هم روی استایل. چون ممکنه توی CSS کلس ها رو به این صورت نوشته باشند :

.container .row .our-team {
	// *****
}

این دستور استایل زمانی کار میکنه که DIV با کلس our-team داخل DIV با کلس container و row قرار گرفته باشه.

 

 

احتمالا مشکل شما هم همینه. اون قسمت از کدها رو کامل منتقل کنید مشکل حل خواهد شد. شاید هم نیاز به ویرایش برخی دستورات و اضافه کردن چند CSS هم باشه ولی شما با همون کپی کردن کامل شروع کنید بخش بزرگی از مشکل حل میشه.

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

با این یه دونه جدید ساختم فقط میخوام تعداد تصاویر داخلش دستی تنظیم  کنم چه طوری انجام بدم؟

[Masih 6,279]

در 1 ساعت قبل، AmiRoo گفته است :

فقط میخوام تعداد تصاویر داخلش دستی تنظیم  کنم

تعداد تصاویر داخل این اسلایدر رو به راحتی با اضافه یا حذف کردن کد تصویر در بخش HTML این اسلایدر میشه تنظیم کرد.

هر تصویر به اینصورت قرار میگیره :

<img src="http://maggiesadler.com/wp-content/uploads/2015/10/1515054_1379051609022475_1394148610_n.jpg" />

که فقط کافیه در قسمت src کد آدرس تصویر رو تغییر بدید و به تعداد تصاویرتون چندین بار از این کد استفاده کنید.

امکان مدیریت بیشتر مثل سرعت تغییر اسلایدها یا در هر تغییر اسلاید چند تصویر رد بشه و ... رو هم در قسمت JS در دسترس دارید

[AmiRoo 18]

در 36 دقیقه قبل، Masih گفته است :

تعداد تصاویر داخل این اسلایدر رو به راحتی با اضافه یا حذف کردن کد تصویر در بخش HTML این اسلایدر میشه تنظیم کرد.

هر تصویر به اینصورت قرار میگیره :

<img src="http://maggiesadler.com/wp-content/uploads/2015/10/1515054_1379051609022475_1394148610_n.jpg" />

که فقط کافیه در قسمت src کد آدرس تصویر رو تغییر بدید و به تعداد تصاویرتون چندین بار از این کد استفاده کنید.

امکان مدیریت بیشتر مثل سرعت تغییر اسلایدها یا در هر تغییر اسلاید چند تصویر رد بشه و ... رو هم در قسمت JS در دسترس دارید

ممنون ولی الان 3تا نشان میده و اسلاید میشه بعدی 3تا دیگه نشان میده... منظورم اینه چه طوری تعداد این 3تارو به مثلا 5تا برسانم

[laruz 983]

در 50 دقیقه قبل، AmiRoo گفته است :

ممنون ولی الان 3تا نشان میده و اسلاید میشه بعدی 3تا دیگه نشان میده... منظورم اینه چه طوری تعداد این 3تارو به مثلا 5تا برسانم

فایل جی‌اس رو نگا کنین. متوجه میشین. مستندات پلاگین slick تو سایتش موجوده

slidesToShow: 3

 

[AmiRoo 18]

نشد...

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

اگر کسی کد داره ممنون میشم بزاره

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

مثل عکس اولی که گذاشتم باشه

[laruz 983]

برادر چک کنین

 

[AmiRoo 18]

در 15 ساعت قبل، laruz گفته است :

برادر چک کنین

 

نشد متاسفانه :((

کد جاوا دقیقا مانند همان در یک فایل به نام jsahf.java و سی اس اس هم styleahf.css ذخیره کردم در روت هاست آپلود کردم

کد نمایشی هم با صفحه ساز beaver builder یه بلوک html گذاشتم و کد هارو گذاشتم داخلش اما همچنان به صورت اسلایدی نمایش نمیده و زیر هم هستن

لینک ها تنها برای اعضای سایت قابل نمایش است.

برای احتیاط جاوا و سی اس اس هم فراخوانی کردم اما نشد

<script src="jsahf.js"></script>
<link type="text/css" rel="stylesheet" href="styleahf.css">
<div class="rio-promos">
	  	<img src="http://maggiesadler.com/wp-content/uploads/2015/10/11189261_759116200870985_1595157767_n.jpg" />
	  	<img src="http://maggiesadler.com/wp-content/uploads/2015/10/10004088_1491055334449687_1187165020_n.jpg" />
	  	<img src="http://maggiesadler.com/wp-content/uploads/2015/10/10817863_856543214397968_517239188_n.jpg" />
	  	<img src="http://maggiesadler.com/wp-content/uploads/2015/10/10919749_326992714172441_299394464_n.jpg" />
	  	<img src="http://maggiesadler.com/wp-content/uploads/2015/10/10617007_939025979457209_6938406_n.jpg" />
	  	<img src="http://maggiesadler.com/wp-content/uploads/2015/10/1168617_1435408473368301_409182770_n.jpg" />
  <img src="http://maggiesadler.com/wp-content/uploads/2015/10/11189836_754178218029431_2102772742_n.jpg" />
  <img src="http://maggiesadler.com/wp-content/uploads/2015/10/10843869_1658219887738208_2033326788_n.jpg" />
  <img src="http://maggiesadler.com/wp-content/uploads/2015/10/1515054_1379051609022475_1394148610_n.jpg" />
	</div>

نباید برای جاوا چیزخاصی بزاریم؟همین فقط کد را بزارم کافیه؟

-------------------

 

[AmiRoo 18]

با کلی دردسر درست کردمش حالا چه طوری میشه تمام صفحه کرد؟مثل حالت عکس اولی که دادم الان عکس ها بهم چسبیده با فصله خیلی کم،میخوام فاصله بگیره و تمام صفحه بشه

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

[Masih 6,279]

برای تغییر حالت نمایش از CSS استفاده کنید.

برای تمام عرض می تونید width: 100% و برای فاصله دهی بین تصاویر از margin: 5px استفاده کنید. اگه فقط سمت چپ و راست رو بخواهید فاصله بدید، از margin-left و margin-right استفاده کنید.

برای تصاویر هم باید روی تگ img از دستور width: 200px و height: 200px قرار بدید که باید اندازه مورد نظرتون رو جایگزین کنید