$('.check').change(function () { if ($(this).attr("checked")) { $('.mydiv').fadeIn(); return; } $('.mydiv').fadeOut(); });
دمو Edit fiddle - JSFiddle
سلام اینا لیست افکتهای پایه ای جی کوئری هستن که میتونید همراه با مثالشون ببینید:
color=#0000CDSHOW:[/color]
کد اصلی:
$( ".target" ).show();
مثال:
show demo
p {
background: yellow;
}
Show it
Hello 2
$( "button" ).click(function() {
$( "p" ).show( "slow" );
});
color=#0000CDHIDE:[/color]
کد اصلی:
$( ".target" ).hide();
مثال:
hide demo
Hello
Click to hide me too
Here is ...
سلام دوستان خوبید؟
امروز دنبال کدی میگشتم که بتونه برای مدتی همه المنتها رو غیر فعال کنه که بالاخره بعد از چند ساعت پیداش کردم
میذارم تا شما هم استفاده کنید :73:
جی کوئری
$("input[name$='disable_all']").click(function () { ...
بروز شده در 10 سال پیش
$(document).ready(function(){ $("#flip").click(function(){ $("#panel").slideToggle("slow"); });
});
#panel,#flip
{
padding:5px;
text-align:center;
background-color:#00cfdc;
border:solid 1px #c3c3c3;
}
#panel
{
padding:50px;
display:none;
background-color:#eaeaea;
}
Click to slide the panel down or up
Hello world!http://softafzar.net
[color=#FF0000]دموی انلاین[/color]
با استفاده از این تابع میتواندر انجام دستوری تاخیر ایجاد کرد.
مثال:
delay demo
div {
position: absolute;
width: 60px;
height: 60px;
float: left;
}
.first {
background-color: #3f3;
left: 0;
}
.second {
background-color: #33f;
left: 80px;
}
Run
$( "button" ).click(function() {
$( "div.first" ).slideUp( 300 ).delay( 800 ).fadeIn( 400 );
$( "div.second" ).slideUp( 300 ).fadeIn( 400 );
});
با استفاده از تابع CSS میتوان استایلی را برای یک المنت تعریف کرد و یا مقدار یک ویژگی را خواند.
مثال - خواندن ویژگی(property)
css demo
div {
width: 60px;
height: 60px;
margin: 5px;
float: left;
}
$( "div" ).click(function() {
var color = $( this ).css( "background-color" );
$( "#result" ).html( ...
با استفاده از رویداد click میتوان مشخص کرد که هنگام کلید روی المنت چه اتفاقی رخ دهد.
مثال:
click demo
p {
color: red;
margin: 5px;
cursor: pointer;
}
p:hover {
background: yellow;
}
First Paragraph
Second Paragraph
Yet one more Paragraph
$( "p" ).click(function() {
$( this ).slideUp();
});
با استفاده از تابع animate میتوان بعضی کدهای CSS را بصورت انیمیشنی اجرا کرد(مانند transition در CSS عمل میکند).
مثال
animate demo
div {
background-color: #bca;
width: 100px;
border: 1px solid green;
}
» Run
Hello!
// Using multiple unit types within one animation.
$( "#go" ).click(function() {
$( "#block" ).animate({
width: "70%",
opacity: 0.4,
marginLeft: "0.6in",
fontSize: "3em",
borderWidth: "10px"
}, ...
با استفاده از توابع RemoveClassوaddClass میتوان کلاس(هایی) را به المنت اضافه یا حذف کرد.
مثال - اضافه کردن کلاس به المنت p
$( "p" ).addClass( "myClass yourClass" );
مثال - حذف کلاس های myClass وnoClass از المنت p و اضافه کردن کلاس yourClass
$( "p" ).removeClass( "myClass noClass" ).addClass( "yourClass" );
با استفاده از تابع Add در جی کوئری میتوان المنتهایی را به المنت موجود اضافه کرد
مثال - اضافه کردن المنت
add demo
Hello
$( "p" ).clone().add( "Again" ).appendTo( document.body );
مثال - اضافه کردن استایل برای دو المنت
add demo
Hello
Hello Again
$( "p" ).add( "span" ).css( "background", "yellow" ...
JS:
$('#pass').keyup(function(e) { var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g"); var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g"); var enoughRegex = new RegExp("(?=.{6,}).*", "g"); if (false == enoughRegex.test($(this).val())) { ...
function stop(e) { if (!e) e = window.event; (e.stopPropagation) ? e.stopPropagation() : e.cancelBubble = true; (e.preventDefault) ? e.preventDefault() : e.returnValue = false; return false; }
سلام برای اینکار میتونید از جی کوئری استفاده کنید
$(function(){ $('a.new-window').click(function(){ window.open(this.href); return false; }); });
بروز شده در 10 سال پیش
سلام
من میخوام با زدن دکمه رنگ background بصورت انیمیشنی تغییر کنه مثلا از ابی به ابی روشن تبدیل بشه
فقط تو background کار نمیکنه مثل برای left کار میکنه
این کد منه:
CSS:
body { background: rgb(85, 138, 150);
}
Jquery:
$( "body" ).animation({ "background": "rgb(173, 216, 230);" }, "normal" );
لطفا کمک کنید
1- ست کردن یک attr
$("img").attr("src", "http://cdn.css-tricks.com/images/banner.jpg");
2- ست کرد چند attr
$("img").attr({ src: "http://cdn.css-tricks.com/images/banner.jpg", title: "banner", alt: "banner"
});
3- گرفتن یک attr
var $source = $("img").attr("src");
بروز شده در 10 سال پیش
[color=#ff0000]سلام عزیزان[/color]
من امشب خیلی خوشحالم میخوام با گذاشتن این پست یه حالی هم به شما بدم :biggrinsmiley:
ادیتور kindeditor یک ادیتور از نوع [1] WYSIWYG ـه که ساده و کم حجمه اما بسیار قدرتمنده و امکانات زیادی داره.
تصویر از محیط ادیتور:
[color=#0000ff]دانلود کنید[/color]
اگر لینک دانلود مشکل داشت بهم خبر بدید :winksmiley02:
1- ...
سلام
این کد فقط پنجره popup رو روزی فقط یک بار برای کاربر نمایش میده:
var needpop = 1;
var vc_cn = "sa";
var vc_url = "http://www.softafzar.net";
if (readCookie(vc_cn)) {
needpop = 0;
}else{
needpop = 1;
}
var PopWidth = screen.width;
var PopHeight = screen.height;
var PopTargetingMethod = 100;
var PopUseDivLayer = 1;
var RTSDomain = vc_url;
var debugDomain = vc_url;
var Page_Popped = ...
سلام
با این کد میتونید کلیک راست رو در صفحات غیر فعال کنید.
$(document).bind("contextmenu",function(e){
return false;
});
function fontResize() { //Set default resolution and font size var resolution = 1024; var font = 13; //Get window width var width = $(window).width(); ...
$(window).bind("load", function() { // IMAGE RESIZE $('#product_cat_list img').each(function() { var maxWidth = 120; var maxHeight = 120; var ratio = 0; var width = $(this).width(); var height = $(this).height(); ...