স্ক্রিনের প্রস্থ 960 px এর চেয়ে কম হলে কিছু করুন

Question

আমার স্ক্রিনের প্রস্থ 960 পিক্সেলের চেয়ে কম হলে আমি কীভাবে jQuery করতে পারি? নীচের কোডটি আমার উইন্ডোর আকার নির্বিশেষে সর্বদা ২ য় সতর্কতা চালায়:

if (screen.width < 960) {
    alert('Less than 960');
}
else {

    alert('More than 960');
}

Comments

পৃষ্ঠাটি লোড করার সময় আপনি যখন এটি করছেন বা যখন আপনি ব্রাউজারকে পুনরায় আকার দিন। কী সিদ্ধান্ত নেওয়ার জন্য ব্যবহৃত হয়েছে তা দেখতে সতর্কতা (স্ক্রিন.উইথ) বলা সর্বদা একটি ভাল ধারণা।

— ফররুখ সুবহানী

কেন মিডিয়া প্রশ্ন নেই ?

— bzlm

কেন মিডিয়া প্রশ্ন নেই? আমি এমন কয়েকটি সংখ্যক কেস সম্পর্কে ভাবতে পারি যেখানে মিডিয়া প্রশ্নগুলি কোনওভাবেই সহায়তা করে না। যদি জেডিএলএন jQuery ব্যবহার করতে চায় তবে ধরে নেওয়া যাক যে এটি করার উপযুক্ত কারণ আছে তার।

— লুক

এটির জন্য প্রচুর ব্যবহার রয়েছে যেখানে মিডিয়া কোয়েরিগুলি কাজ করে না, উদাহরণস্বরূপ কেবলমাত্র পর্দার প্রস্থটি 1000 পিক্সেলের চেয়ে বেশি হলেই রাজমিস্ত্রি প্রভাব সক্রিয় করতে।

— পেক্কা 20

Answer 1

উইন্ডোটির প্রস্থ পেতে jQuery ব্যবহার করুন।

if ($(window).width() < 960) {
   alert('Less than 960');
}
else {
   alert('More than 960');
}

Comments

মনে রাখবেন যে স্ক্রোলবারটি দৃশ্যমান হলে $ (উইন্ডো)। প্রস্থ () ব্রাউজারগুলিতে সুসংগত নয়। আমি খুঁজে পেয়েছি যে জাভাস্ক্রিপ্ট মিডিয়া ক্যোয়ারী ব্যবহার করা অনেক বেশি নির্ভরযোগ্য।

— forsvunnet

নিবন্ধন করুন

— শাহ আবাজ খান

জাভাস্ক্রিপ্ট মিডিয়া প্রশ্নগুলির একটি লিঙ্ক: w3schools.com/howto/howto_js_media_queries.asp

— টিমার আইভো বাটিস

Answer 2

আপনি এটি পুনরায় আকারের ইভেন্টের সাথে একত্রিত করতে চাইতে পারেন:

 $(window).resize(function() {
  if ($(window).width() < 960) {
     alert('Less than 960');
  }
 else {
    alert('More than 960');
 }
});

আরজে এর জন্য:

var eventFired = 0;

if ($(window).width() < 960) {
    alert('Less than 960');

}
else {
    alert('More than 960');
    eventFired = 1;
}

$(window).on('resize', function() {
    if (!eventFired) {
        if ($(window).width() < 960) {
            alert('Less than 960 resize');
        } else {
            alert('More than 960 resize');
        }
    }
});

আমি কোনও সাফল্য ছাড়াই http://api.jquery.com/off/ চেষ্টা করেছিলাম তাই আমি ইভেন্টটির সাথে আগত পতাকাটি দিয়েছিলাম।

Comments

পুনরায় আকারের ইভেন্টে মোড়ানো কেবল এটিকে পুনরায় আকারে জ্বালিয়ে দেয়, লোড নয়।

— টেড

@ টেড তাই আমি বলেছি combine it with।

— জে কে।

@ আরজে উপরের সম্পাদনাগুলি দেখুন। কোনও ইভেন্ট 'সাফ' বলতে আপনি কী বোঝেন তা আমি জানি না তাই আমি ঘটনাটিকে আবার গুলি চালানো থেকে বিরত রাখতে গিয়েছিলাম।

— জে কে।

কল্পনাপ্রসূত, আমি কয়েকদিন ধরে কীভাবে equalHeightsপুনরায় আকার দেওয়ার জন্য কোনও ফাংশন বাঁধতে পারি তবে কেবল but than68 এর চেয়ে বেশি প্রস্থের জন্য এটি বের করার চেষ্টা করছি This এটি একটি কবজির মতো কাজ করে। ধন্যবাদ

— ড্যানি ইংলন্ডার

— কোডটির

Answer 3

আমি এই জাতীয় জিনিসের জন্য jQuery ব্যবহার না করার পরামর্শ দিয়ে এগিয়ে চলেছি window.innerWidth:

if (window.innerWidth < 960) {
    doSomething();
}

Comments

জিকুয়ারি ব্যবহার না করাই কেন ভাল?

— কোনও জিনিসের

@ রায়সন আমি দেখতে পেলাম যে $ (উইন্ডো)। প্রস্থে () স্ক্রোল বারগুলি অন্তর্ভুক্ত করবে না - সুতরাং আপনার যদি 960px এর একটি সেক্রাইন থাকে, তবে এটি 944px ফেরত দেবে এবং আপনার জেএসগুলি উদ্দেশ্য অনুযায়ী ফায়ার করবে না। এই সমাধানটি 960px ফিরে আসবে

— শান টি

Answer 4

আপনি জাভাস্ক্রিপ্ট সহ মিডিয়া ক্যোয়ারীও ব্যবহার করতে পারেন।

const mq = window.matchMedia( "(min-width: 960px)" );

if (mq.matches) {
       alert("window width >= 960px");
} else {
     alert("window width < 960px");
}

Answer 5

আমি পরামর্শ দেব (jQuery প্রয়োজন):

/*
 * windowSize
 * call this function to get windowSize any time
 */
function windowSize() {
  windowHeight = window.innerHeight ? window.innerHeight : $(window).height();
  windowWidth = window.innerWidth ? window.innerWidth : $(window).width();

}

//Init Function of init it wherever you like...
windowSize();

// For example, get window size on window resize
$(window).resize(function() {
  windowSize();
  console.log('width is :', windowWidth, 'Height is :', windowHeight);
  if (windowWidth < 768) {
    console.log('width is under 768px !');
  }
});

কোডপেনে যুক্ত হয়েছে: http://codepen.io/moabi/pen/QNRqpY?editors=0011

তারপরে আপনি বিভিন্ন: উইন্ডোউইথ এবং উচ্চতা: উইন্ডো হাইটের সাহায্যে উইন্ডোটির প্রস্থ সহজেই পেতে পারেন

অন্যথায়, একটি জেএস লাইব্রেরি পান: http://wicky.nillia.ms/enquire.js/

Answer 6

// Adds and removes body class depending on screen width.
function screenClass() {
    if($(window).innerWidth() > 960) {
        $('body').addClass('big-screen').removeClass('small-screen');
    } else {
        $('body').addClass('small-screen').removeClass('big-screen');
    }
}

// Fire.
screenClass();

// And recheck when window gets resized.
$(window).bind('resize',function(){
    screenClass();
});

Answer 7

ব্যবহার

$(window).width()

অথবা

$(document).width()

অথবা

$('body').width()

Answer 8

আমি জানি আমি এর উত্তর দিতে দেরি করেছি, তবে আমি আশা করি এরকম সমস্যা আছে এমন কারও পক্ষে এটি কিছুটা সহায়তা করবে। পৃষ্ঠা যখন কোনও কারণে রিফ্রেশ করে তখন এটিও কাজ করে।

$(document).ready(function(){

if ($(window).width() < 960 && $(window).load()) {
        $("#up").hide();
    }

    if($(window).load()){
        if ($(window).width() < 960) {
        $("#up").hide();
        }
    }

$(window).resize(function() {
    if ($(window).width() < 960 && $(window).load()) {
        $("#up").hide();
    }
    else{
        $("#up").show();
    }

    if($(window).load()){
        if ($(window).width() < 960) {
        $("#up").hide();
        }
    }
    else{
        $("#up").show();
    }

});});

Answer 9

এই কোড ব্যবহার করে দেখুন

if ($(window).width() < 960) {
 alert('width is less than 960px');
}
else {
 alert('More than 960');
}

   if ($(window).width() < 960) {
     alert('width is less than 960px');
    }
    else {
     alert('More than 960');
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 10

নাহ, এই কিছুই কাজ করবে না। আপনার যা দরকার তা এই !!!

এটা চেষ্টা কর:

if (screen.width <= 960) {
  alert('Less than 960');
} else if (screen.width >960) {
  alert('More than 960');
}

Comments

লিঙ্ক পোস্ট করা কোনও উত্তর নয়।

— nedaRM

দুঃখিত যে আমি তাড়াতাড়ি কৃপা ছিল! এক মিনিট অপেক্ষা করুন, আমি এখনই এটি করছি ...

— সৌরভ চৌধুরী

দয়া করে মনে রাখবেন যদি স্ক্রিন.উইথ ( document.body.clientWidthভ্যানিলা জেএস ব্যবহার করে সর্বাধিক ক্যাপচার করা হয়েছে ) <= 960 (তবে যদি এখানে বিবৃতিটি বোঝায়) তবে কেবলমাত্র অন্য একটি বিকল্প (ইএলএসই স্ক্রিনউইউথথ> 960) তাই অন্যথায় এখানে অপ্রয়োজনীয় যদি ব্যবহার করা হয়। ব্যবহার document.body.clientWidth <=960 ? handleSmallerThan960() : handleLargerThan960()বা কিছু বৈকল্পিক। (রিডানডেন্ট কোড) এর জন্য আর দরকার নেই

— জারগোল্ড