سلام بچه ها
من تو صفحه سايتم چند تا عكس دارم با سايز كوچيك
حالا مي خوام اگه موس روي هر كدوم از عكسا وايساد سايز واقعي عكس تو كادر نشون داده بشه نمي خوام صفحه جديد باز بشه يا رو عكس كليك كنه
ممنون
Printable View
سلام بچه ها
من تو صفحه سايتم چند تا عكس دارم با سايز كوچيك
حالا مي خوام اگه موس روي هر كدوم از عكسا وايساد سايز واقعي عكس تو كادر نشون داده بشه نمي خوام صفحه جديد باز بشه يا رو عكس كليك كنه
ممنون
خب فقط با اچ تی ام ال نمیشه چنین کاری کرد. باید از سی اس اس و یا جاوا اسکریپت استفاده کنید:
[ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]
از اونجایی که نمیدونستم تا چه حد طراحی وب و زبان های طراحی وب بلدید کم توضیح دادم. اگر متوجه نشدید بگید بیشتر توضیح بدم.
خيلي بلد نيستم
اگه مي شه بيشتر توضيح مي ديد سي اس اس هم يه كم بلدم
با onmouseover بايد اين كارو بكنم؟
با onmouseover اين كارو كردم فقط عكس بزرگه مي ره زير نوشته ها چطوري بگم روي همه چيز باشه
خب احتمالا کادرتون کوچیک تر از اندازه ی عکسه که می تونید پایین عکسها، یک div یا المنت دیگه ای بسازید و طوری تعریف کنید که این عکسی که hover میشه display:none شه و جاش درون اون div با innerHTML بندازیدش یا اصلا عکس قبلی رو هم display:none نکنید.
من خيلي نفهميدم چي گفتيد
من نمي خوام صفحه تغييري كنه فقط رو هر كدوم از عكسا رفت سايز بزرگشو نشون بده همين
مكه اين كارو با اين دستور كردم
<div class="img_bg"><img src="images/img5.jpg" class="row_img" alt=""
onmouseover="this.src='images/Untitled-2.jpg';"
onmouseout="this.src='images/img5.jpg';"/>
فقط عس بزرگه مي ره زير بقيه عكسها و نوشته ها كه بايد بياد روشون
يه چيزي مثل اين سايت مي خاوم
كه وقتي مي ري رو نمونه سايتها بهت preview نشون مي ده
[ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]
آهان خب اونا رو هم میشه به صورت آماده دانلود کرد:
[ برای مشاهده لینک ، با نام کاربری خود وارد شوید یا ثبت نام کنید ]
هم خودتون بسازید:
کد:<html>
<head>
<script src="imgprev.js"></script>
</head>
<body>
<img id="imgPrev" style="display:none;" />
<img src="gravatar.png" id="littImg" onmouseover="imgHover(event)" onmousemove="imgHover(event)" onmouse="document.getElementById('imgPrev').style.display='none';" />
</body>
</html>
که اولی رو پیشنهاد می کنم. (ینی همون MagicZoom)کد:function imgHover(e) {
imgSrc=document.getElementById('littImg').getAttribute('src');
if (document.layers||document.getElementById&&!document.all) {
var mX = e.pageX;
var mY = e.pageY;
} else if (document.all) {
mX = window.event.clientX;
mY = window.event.clientY;
}
var ele = document.getElementById('imgPrev');
ele.setAttribute('src', imgSrc);
ele.style.display='block';
ele.style.position='absolute';
ele.style.left=mX+'px';
ele.style.top=mY+'px';
}
مرسي فقط اين
imgprev.js
رو از كجا بيارم؟؟؟؟؟؟؟؟؟؟
همین این یکی کد زیریست که دادم. بالاییه اچ تی ام الست پایینیه همون فایلست. البته منظورم از راه اول اون magiczoom بودا. این اسکریپته که کدش رو زدم رو زیاد براش وقتی نذاشتم.
MagicZoom
چي هست يه سايته كه توش عكسه موتوره؟؟؟؟؟؟؟؟؟؟؟؟/
ممنون درست شد فقط عسا كه بزرگ مي شه پايينش يه جمله نوشته مال خود سايته چطوري اونو مي تونم بردارم؟
يه چيز ديكه كدي كه من گذاشتم كه وابسته به سايتش نيست؟؟