رفتن به مطلب

نحوه باز شدن لینک به صورت ajax


پست های پیشنهاد شده

با سلام و درود خدمت اساتید محترم

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

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

من میخوام این لینک ها به همون صورت که وقتی روی عکس کلیک میکنی و باز میشه تایپیک نمایان بشه

و به صفحه دیگه ای نره

و بشه به اون صفحه استایل داد

دوستان واقعا به این مورد و همچنین پاسخ کامل و صحیح شماشدیدا نیاز دارم

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

ممــــــــنون

لینک به ارسال

این چیزی که شما گفتی خودش دو سه تا حالت بود آژاکس یک چیزه لایت باکس که عکس ها درش باز می شند چیز دیگه ؟

نشانی بگذارید و دقیق روشن کنید چه می خواهید ؟

لینک به ارسال

این چیزی که شما گفتی خودش دو سه تا حالت بود آژاکس یک چیزه لایت باکس که عکس ها درش باز می شند چیز دیگه ؟

نشانی بگذارید و دقیق روشن کنید چه می خواهید ؟

استاد دقیقا مثل این وبسایت

http://www.ordogahemohajeran.com

خواهشا صریح و واضح پاسخ دهید خیلیییی ممنون

لینک به ارسال

اینجا آموزش داده:


http://tutorialzine.com/2012/07/framewarp-jquery-plugin/

البته انگلیسی هست

و این هم دمویی از نتیجه نهایی آموزش:


http://demo.tutorialzine.com/2012/07/framewarp-jquery-plugin/

لینک به ارسال

دمت گرم ولی فارسه باشه بهتره من زبانم ضعیفه

بی زحمت آموزش فارسی ارائه بدید

ممنون

لینک به ارسال

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

وردپرس یک cms است و خاصیت cms اینه که می تونید مطالب متعدد و دلخواه بهش اضافه کنید در صورتیکه همچین سایتی با یک تعداد مطلب مشخص و یک کد آژاکس ساخته می شه و اصولا نیازی به وردپرس نداره اما وردپرس هم افزونه های متعددی برای لایت باکس داره یکیشون را از مخزن وردپرس نصب کنید و برای صفحات داخلی یک برگه به نام single.php با کدهای زیر بسازید و بگذارید داخل پوشه قالب

<!DOCTYPE html>

<html dir="rtl" lang="fa">

<head>

<meta charset="UTF-8">

<title><?php bloginfo('name'); ?></title>

<!-- Meta -->

<meta name="description" content="<?php bloginfo('description'); ?>">

<style type="text/css">

section {text-align:justify;margin:10px 4%;padding:10px 1%;width:90%;display:block;}

h2 {font-size:16px;color:#CC0000}

</style>

<?php wp_head(); ?>

</head>

<body>

<!-- Section -->

<section>

<?php while (have_posts()) : the_post(); ?>

<!-- Article -->

<article>

<!-- Post Title -->

<h2 class="post-title">

<?php the_title(); ?>

</h2>

<!-- /Post Title -->

<?php the_content(''); ?>

<div class="cleared"> </div>

</article>

<!-- /Article -->

<?php endwhile; ?>

</section>

<!-- /Section -->

<?php endif; ?>

<footer>

<?php wp_footer(); ?>

</footer>

</body>

</html>

و لینکهای ایندکستون را از طریق افزونه لایت باکس تعریف کنید

لینک به ارسال

داداش من این کد هارو تو یک فایل سینگل کپی کردم این مشکل تو نرم افزار دریم ویور رخ داد که میگه تو خط 32 یه مشکلی وجود داره

28806809572673514975.png

واین پلاگین رو که فارسی هم شده پیدا کردم

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

;)

لینک افزونه:

http://wordpressi.ir...ightbox-plugin/

ویرایش شده توسط shayan
لینک به ارسال

<!DOCTYPE html>

<html dir="rtl" lang="fa">

<head>

<meta charset="UTF-8">

<title><?php bloginfo('name'); ?></title>

<meta name="description" content="<?php bloginfo('description'); ?>">

<style type="text/css">

section {text-align:justify;margin:10px 4%;padding:10px 1%;width:90%;display:block;}

h2 {font-size:16px;color:#CC0000}

</style>

<?php wp_head(); ?>

</head>

<body>

<?php if (have_posts()) :?>

<section>

<?php while (have_posts()) : the_post(); ?>

<article>

<h2 class="post-title">

<?php the_title(); ?>

</h2>

<?php the_content(''); ?>

<div class="cleared"> </div>

</article>

<?php endwhile; ?>

</section>

<?php endif; ?>

<footer>

<?php wp_footer(); ?>

</footer>

</body>

</html>

این کد را جایگزین قبلی کنید

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

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

لینک به ارسال

این افزونه جایی برای تنظیم روی لینک نداره شما افزوه فارسی ای سراغ دارید؟؟

ویه مسئله مهم:

من الآن این یک فایل سینگل ساختم و اون کد ها رو توش کپی کردم

و به فرض این که اون پلاگین هم بر روی لینک تنظیم شد

خب یعنی کار دیگه ای نمیمونه؟؟؟!!!!!

کامل میشه

و اینکه من میخوام این مطالب رو که قراره به صورت لایت باکس باز بشه تو قسمت برگه های وردپرس مدیریتشون کنم

خواهشا به طور کلی و کامل توضیح بدید استاد

که باید دقیقا چیکار کنم

و آیا قالب من فقط با فایل های index , style, single کامل میشه؟

من آلان همین فایل ها رو فقط دارم

لینک به ارسال

اگر می خواهید در بخش برگه ها مدیریتش کنید باید صفحه ای که می سازید را با نام page.php ذخیره کنید

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

لینک به ارسال


<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/lib/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/source/jquery.fancybox.js"></script>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url'); ?>/source/jquery.fancybox.css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$('.fancybox').fancybox();
});
</script>

در header.php کپی کنید و فایل زیر را در قالب خود آن زیپ کنید

به لینک صفحات در صفحه ایندکس کلاس

fancybox fancybox.iframe

بدهید مثل


<a class="fancybox fancybox.iframe" href="<?php bloginfo('url'); ?>/?p=1234">Iframe</a>

fany.zip

لینک به ارسال

فوق العاده بووووووووووووووووود

ممنووووووووووووووون

:wub:

استاد عزیز یه چند مورد دیگه:

1- چجوری به این صفحات استایل بدم؟

2- چجوری سایز این صفحه رو بزرگ تر کنم؟

3-و این که چجوری کلمه close رو به پارسی ترجمه کنم؟

ویرایش شده توسط shayan
لینک به ارسال

مدونم نباید اسپم بدم و بگم منتظر جوابم :D

ولی خدا وکیلی عجله دارم

ممنون از زحمات بی نظیرتون

لینک به ارسال

کلمه close کجا هست ؟

من یادم نمی آد

استایلا به برگه ها را که می توانید به برگه ای که برای page.php ساختید بدید البته بک گراند را می تونید در style.css به iframe بدید

برای بزرگ کردن سایز صفحات درز اصل باید مقدار نوشتتون افزایش بدید ولی می تونید در فایلهای دانلود شده /source/jquery.fancybox.css را باز کنید


.fancybox-iframe

را جستجو کنید و براش خاصیت


min-width:999px

بگذارید (به جای 999 عدد دلخواه را بگذارید )

و می تونید در برگه page.php برای تگ body خاصیت


margin:50px;

بگذارید و با تغییر عدد 50 به عدد دلخواه برسید

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

لینک به ارسال

منظورم هاور بستن صفحه هست که واژه close هست

در ضمن این روش های تغییر سایز جواب نداد

لینک به ارسال

من تو فایل jquery.fancybox.css تو قسمت


.fancybox-image, .fancybox-iframe {

محتویاتش رو به این صورت تغییر دادم


.fancybox-image, .fancybox-iframe {
display: block;
width: 800px;
height:400px;

و این اتفاق افتاد:

71940676880846896493.png

حالا میخوام این قسمت های سفید هم با اون قسمت اصلی هم اندازه بشه!

چی کار کنم دقیقا؟؟؟

لینک به ارسال

کاری که من عرض کردمک را انجام دهید یکگ خط پایین تر از همینجا


.fancybox-iframe {
min-width:800px;
min-height:400px;
}

لینک به ارسال

برای ویرایش close از خط 137 تا 144 صفحه jquery.fancybox.js

را با


wrap : '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div></div>',
image : '<img class="fancybox-image" src="{href}" alt="" />',
iframe : '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen' + ($.browser.msie ? ' allowtransparency="true"' : '') + '></iframe>',
error : '<p class="fancybox-error">در حال حاضر درخواست شما قابل مشاهده نیست.<br/>لطفا مجددا تلاش نمایید .</p>',
closeBtn : '<a title="بستن" class="fancybox-item fancybox-close" href="javascript:;"></a>',
next : '<a title="بعدی" class="fancybox-nav fancybox-next" href="javascript:;"><span></span></a>',
prev : '<a title="قبلی" class="fancybox-nav fancybox-prev" href="javascript:;"><span></span></a>'

عوض کنید و در موقع ذخیره دقت کنید که با انکدینگ utf8 صفحه را ذخیره کنید

post-336-0-06681900-1377368900_thumb.jpg

لینک به ارسال

نمیدونم مشکل از کجاست که جواب نمیده !!!!!

محتویات کلاس تغییر یافته:


.fancybox-iframe {
padding:0px;
background:#E7E7DA url('../images/iframebg.png') repeat-y scroll center top;
background-clip:content-border;
min-width:50px;
min-height:10px;
}

.............................................

پاسخ بعدی:

دریم ویور میگه تو خط 143 مشکلی وجو داره استاد

ویرایش شده توسط shayan
لینک به ارسال

content-border جزو خواص css3 است و دریم ویر روش گیر می ده ولی ارور نیست الان تقریبا همه مرورگرها می شناسندش

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

لینک به ارسال

content-border جزو خواص css3 است و دریم ویر روش گیر می ده ولی ارور نیست الان تقریبا همه مرورگرها می شناسندش

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

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

تو کلاس


.fancybox-iframe {

این موارد رو اضافه کردم


min-width:50px;
min-height:10px;
}

مابقی موارد تو خود کلاس بود و من بهشون دست نزدم !!!!

آیا شما تست کردید این مورد رو؟؟

ویرایش شده توسط shayan
لینک به ارسال

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

همین!

:)

برای ویرایش close از خط 137 تا 144 صفحه jquery.fancybox.js

را با


wrap : '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div></div>',
image : '<img class="fancybox-image" src="{href}" alt="" />',
iframe : '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen' + ($.browser.msie ? ' allowtransparency="true"' : '') + '></iframe>',
error : '<p class="fancybox-error">در حال حاضر درخواست شما قابل مشاهده نیست.<br/>لطفا مجددا تلاش نمایید .</p>',
closeBtn : '<a title="بستن" class="fancybox-item fancybox-close" href="javascript:;"></a>',
next : '<a title="بعدی" class="fancybox-nav fancybox-next" href="javascript:;"><span></span></a>',
prev : '<a title="قبلی" class="fancybox-nav fancybox-prev" href="javascript:;"><span></span></a>'

عوض کنید و در موقع ذخیره دقت کنید که با انکدینگ utf8 صفحه را ذخیره کنید

post-336-0-06681900-1377368900_thumb.jpg

درست شد ممنون

;)

لینک به ارسال

اعدادی که من عرض کردم 50 و 10 نبو.د همون اعدادی بود که شما برای width و height گذاشته بودید

اون ها را به 100% تغییر بدید و اعداد را به این قسمت انتقال بدید

لینک به ارسال

منظورتون اینجوریه؟


.fancybox-iframe {
padding:0px;
background:#E7E7DA url('../images/iframebg.png') repeat-y scroll center top;
background-clip:content-border;
min-width:100%;
min-height:100%;
}

ولی بازم تغییری نکرد داداش !

لینک به ارسال

.fancybox-image, .fancybox-iframe {
display: block;
width: 100%;
height: 100%;
}
.fancybox-iframe {
padding:0px;
background:#E7E7DA url('../images/iframebg.png') repeat-y scroll center top;
background-clip:content-border;
min-width:800px;
min-height:400px;
}

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...