ওয়েব ক্যাপচার এবং রূপান্তর করার সরঞ্জামসমূহ

জাভাস্ক্রিপ্ট সহ স্টাইল স্ক্রিনশট

জাভাস্ক্রিপ্ট API

গ্র্যাবসআইটির জাভাস্ক্রিপ্ট এপিআই সমস্ত উত্পন্ন এইচটিএমএল উপাদানগুলিকে সিএসএস সহ স্টাইল করার অনুমতি দেয়।

স্টাইল ইমেজ

ইমেজ স্ক্রিনশট ব্যবহার করে স্টাইল করা যেতে পারে displayid এবং displayclass প্যারামিটার। এই প্যারামিটারগুলি চিত্রগত বস্তুটিতে গতিশীলভাবে আইডি বা শ্রেণীর বৈশিষ্ট্য রেসিস্টিভলে যুক্ত করে। নীচে ক সিএসএস স্ক্রীনশট চিত্রের জন্য শ্রেণি বরাদ্দ করা হয়েছে।

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"displayclass": "MyClass"}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"displayclass": "MyClass"}).Create();
</script>

সিএসএস এর পরে চিত্রটি স্টাইল করার জন্য নির্দিষ্ট করা যেতে পারে, যা নীচে দেখানো হয়েছে।

<style>
.MyClass
{
    border:1px solid red;
}
</style>

এই বিকল্পগুলি ব্যবহারের অতিরিক্ত সুবিধা আপনাকে স্ক্রিনশট চিত্রটি ম্যানিপুলেট করতে জাভাস্ক্রিপ্ট ব্যবহার করার অনুমতি দেয়। নির্দিষ্ট আইডি নীচে উত্পন্ন চিত্রের স্ক্রিনশট এবং তারপরে নির্দিষ্ট করা থাকে onfinish স্ক্রিনশটটি লোড হয়ে গেলে ফাংশনটিকে ডাকা হয়। এই ফাংশনটি পরে স্ক্রিনশট চিত্র পেতে নির্দিষ্ট আইডি ব্যবহার করে এবং এর উচ্চতা প্রদর্শন করে।

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"displayid": "myScreenshot", "onfinish": function (id){
        var div = document.getElementById('myScreenshot');
        alert(div.height);
    }}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"displayid": "myScreenshot", "onfinish": function (id){
        var div = document.getElementById('myScreenshot');
        alert(div.height);
    }}).Create();
</script>

স্টাইল ত্রুটি বার্তা ages

ত্রুটি বার্তা ব্যবহার করে স্টাইল করা যেতে পারে can errorid এবং errorclass প্যারামিটার। এই প্যারামিটারগুলি ত্রুটি বার্তায় যথাক্রমে আইডি বা শ্রেণি বৈশিষ্ট্য যুক্ত করে <span> উপাদান, অতিরিক্ত ডিফল্ট ত্রুটি শৈলী অপসারণ করার সময়।

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"errorclass": "MyErrorClass"}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"errorclass": "MyErrorClass"}).Create();
</script>

ত্রুটি বার্তাটি পরে নীচের চিত্রের মতো স্টাইল করা যেতে পারে।

<style>
.MyErrorClass
{
    font-weight:bold;
}
</style>

অবশ্যই যদি এটি এর সাথে সংমিশ্রণে ব্যবহৃত হয় onerror ইভেন্টের পরে ত্রুটি বার্তাটি জাভাস্ক্রিপ্টের মাধ্যমে ম্যানিপুলেট করা যায়। নীচে ক errorid নির্দিষ্ট করা হয়েছে যাতে ত্রুটির বার্তা স্প্যানটি রেফারেন্স করা যায় onerror ফাংশন। এই ফাংশনটি পরে ত্রুটি বার্তা পরিবর্তন করে যদি নির্দিষ্ট ত্রুটি কোডটি ফিরে আসে।

<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertURL("https://www.tesla.com", 
    {"errorid": "myErrorMessage", "onerror": function (message, code){
        if (code == 500)
        {
            var span = document.getElementById('myErrorMessage');        
            if (span != null)
            {
                span.innerHTML = "Oops! We will get this sorted!";
            }
        }
    }}).Create();
</script>
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML("<html><body><h1>Hello World!</h1></body></html>",
    {"errorid": "myErrorMessage", "onerror": function (message, code){
        if (code == 500)
        {
            var span = document.getElementById('myErrorMessage');        
            if (span != null)
            {
                span.innerHTML = "Oops! We will get this sorted!";
            }
        }
    }}).Create();
</script>